SharePoint priority column formatting: colored flags

Replace the word "High" with a red flag people can spot from across the room, keep the label for clarity, and let anyone change the priority with a click.

A Priority column in SharePoint or Microsoft Lists is usually a Choice column — Critical, High, Medium, Low — and by default every value looks identical: plain text, same weight, same color. That defeats the point. Priority exists so people can find the urgent items first, and text they have to read is not something they can scan.

With a small piece of column formatting JSON, each value gets a flag icon in its own color, escalating from grey through amber to dark red, with the label still beside it for anyone who can't rely on color alone. The cell stays click-to-edit, so re-prioritising is one click rather than a form.

Before and after

What the SharePoint priority flag JSON looks like

The generator produces JSON like the example below: a flex row with a flag icon whose color is an expression over the field's value, followed by the label. 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",
  "inlineEditField": "[$Priority]",
  "style": {
    "cursor": "pointer",
    "display": "flex",
    "align-items": "center"
  },
  "children": [
    {
      "elmType": "span",
      "attributes": {
        "iconName": "Flag"
      },
      "style": {
        "font-size": "14px",
        "color": {
          "operator": "?",
          "operands": [
            { "operator": "==", "operands": ["[$Priority]", "Critical"] },
            "#a4262c",
            {
              "operator": "?",
              "operands": [
                { "operator": "==", "operands": ["[$Priority]", "High"] },
                "#d13438",
                {
                  "operator": "?",
                  "operands": [
                    { "operator": "==", "operands": ["[$Priority]", "Medium"] },
                    "#d29200",
                    {
                      "operator": "?",
                      "operands": [
                        { "operator": "==", "operands": ["[$Priority]", "Low"] },
                        "#605e5c",
                        "#605e5c"
                      ]
                    }
                  ]
                }
              ]
            }
          ]
        },
        "margin-right": "6px"
      }
    },
    {
      "elmType": "span",
      "txtContent": "=if([$Priority] == '', '—', [$Priority])",
      "style": {
        "font-weight": "600",
        "font-size": "12px"
      }
    }
  ]
}

iconName is the interesting part. SharePoint ships the Fluent UI icon set, and any icon name you put in that attribute is drawn as a glyph — Flag here, but Important, Warning, Up and Down all work if a flag isn't your style. The color expression walks down your levels — a nest of ? (if/else) objects, one per level — and falls back to grey for any value it doesn't recognise, and the label shows a dash rather than nothing when the cell is empty, so an unset priority is visibly unset. The object form is deliberate: SharePoint's shorter =if(…) strings can't hold a quote, so a level named Client's review would never match there, whereas an object operand is a plain JSON string.

If you want people to step through priorities rather than pick from a dropdown, two sibling templates do that: Priority Stepper adds − and + buttons that move Low → Normal → High → Critical and stop at each end, and Priority Bars does the same with a signal-strength visual.

How to apply it

1. Open the generator and pick the Priority Flag template (or use the button above).
2. Enter your column's internal field name — see the note below.
3. Edit the Levels so the values match your column's choices exactly, and pick a color for each.
4. Click Copy.
5. In SharePoint: Column settings → Format this column → Advanced mode.
6. Delete what's in the box, paste, click Preview, then Save.

Common questions