SharePoint status column color formatting

Turn a plain status column into green, yellow, and red pills so people can scan your list in a second — without writing JSON by hand.

By default, a SharePoint (or Microsoft Lists) Status column shows plain grey text: "Completed", "In Progress", "Blocked". With a small piece of column formatting JSON, you can render each value as a colored pill instead. This page shows what that looks like, the JSON behind it, and how to apply it in a couple of minutes.

Before and after

What the SharePoint choice pill JSON looks like

The generator produces clean JSON like the example below. Each if() matches a choice value and sets the pill's background color. You don't have to write this — it's shown so you know what you're pasting:

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "txtContent": "[$Status]",
  "style": {
    "padding": "4px 10px",
    "border-radius": "12px",
    "color": "white",
    "background-color": "=if([$Status] == 'Completed', '#107c10', if([$Status] == 'In Progress', '#d29200', if([$Status] == 'Blocked', '#d13438', '#605e5c')))"
  }
}

This is standard SharePoint choice pill JSON: a single div with the field value as text and a conditional background color. The generator builds the nested if() for you from whatever choices you enter.

How to apply it

The step-by-step guide spells out every click, with pictures. In short:

1. Click Build this status formatter above. It opens the step-by-step guide with the Colored status labels design already picked.
2. In step 2, type your column’s name, then change the options and colors to match your list.
3. No Choice column yet? Step 3 shows exactly how to add one.
4. Click Copy my code.
5. In your list, click the name at the top of your column, then Column settings, then Format this column. At the bottom of the panel that opens, click Advanced mode.
6. Click inside the box, press Ctrl+A and then Delete to empty it, and press Ctrl+V to paste. Click Preview, then Save.

Common questions