Others

How to Change SharePoint List Form Section Header Colors with JSON

Algirdas Jasaitis Oct 19, 2026 869 views

Question details

The user wants to customize and change the color of section headers in a SharePoint list form, which are displayed in black by default.

How to Change SharePoint List Form Section Header Colors with JSON

Product: SharePoint
Device & OS: not provided
Scenario: Customizing the appearance and layout of a SharePoint list form to match organizational branding or improve readability.
Observed behavior: Section headers in SharePoint list forms appear black by default, and standard list configuration settings do not offer an interface to change these colors without custom code.

Before you start

Ensure you have the appropriate site permissions (such as Edit or Full Control) to modify list settings and configure form layouts in your SharePoint environment.

Solution 1Recommended

Apply Custom JSON Formatting to the Form Body

Use the built-in form configuration panel in SharePoint to inject custom JSON code that defines the section header colors.

Since SharePoint does not provide a standard point-and-click interface to change header colors, you must use JSON to define the styles for your form sections.

Open a New Form

Navigate to your SharePoint list and click the 'New' button to open the list item entry form.

Access the Form Configuration

Click the 'Edit form' icon (usually a gear or pencil icon) at the top right corner of the form pane and select 'Configure layout'.

Select Body Formatting

In the formatting panel that appears on the right, ensure that 'Body' is selected in the 'Apply to' dropdown menu.

Paste and Save JSON Code

Paste your custom JSON formatting code that specifies your desired header colors into the text box, then click 'Save' to apply the changes.

Apply Custom JSON Formatting to the Form Body

JSON Structure: Your JSON code must match your specific list columns and structural requirements to successfully render the custom section headers.

Solution 2

Seek Code Assistance from Microsoft Q&A Specialists

If you are unfamiliar with writing JSON code, request tailored formatting scripts from SharePoint development experts.

Free Microsoft Office alternative

Looking for a Lightweight Alternative for Your Office Documents?

While customizing SharePoint list forms requires specific JSON formatting, editing your daily reports, data sets, and presentations shouldn't be complicated. WPS Office offers a free, highly compatible, and lightweight alternative to Microsoft Office, allowing you to seamlessly manage all your standard file formats without a steep learning curve.

1. Download the Installer: Visit the official WPS Office website and download the free version for your Windows, Mac, or Linux operating system.
2. Install WPS Office: Run the downloaded installation file and follow the straightforward on-screen instructions to set up the software.
3. Open Your Documents: Double-click any of your existing Microsoft Office files to instantly open and edit them in WPS Office with full formatting compatibility.

Fully compatible with Microsoft Word, Excel, and PowerPoint file formats (.docx, .xlsx, .pptx)Lightweight architecture ensures fast startup and minimal system resource usageFamiliar user interface makes migration seamless for existing Office usersAll-in-one suite combining document, spreadsheet, presentation, and PDF editing tools

microsoft office alternative - wps office

Frequently Asked Questions

Can I change SharePoint list form colors using standard settings?

No, the standard SharePoint list settings do not provide a built-in UI option to change section header colors. Customizing these colors requires custom JSON formatting or specialized SharePoint development.

Where do I input the JSON code to format my SharePoint form?

You can input the custom JSON code by opening a new list item form, clicking the 'Edit form' icon at the top right, selecting 'Configure layout', and pasting your code into the 'Body' formatting section.

What should I do if my custom JSON breaks the SharePoint form layout?

If the custom JSON code causes display issues, simply return to the 'Configure layout' panel, highlight and delete the JSON script from the text box, and click 'Save'. This will immediately revert the form back to its default appearance.

Office Quick Solutions