SharePoint column formatting

SharePoint date column formatting

Make deadlines obvious: highlight overdue dates in red, show how many days are left, or replace a raw date with friendly text like "Today" or "in 3 days".

A raw SharePoint date — 5/30/2026 — tells you very little at a glance. With column formatting JSON, a date column can react to how close (or past) the date is, so your most urgent items stand out without anyone reading every row.

Before and after

TaskDue date
Submit budgetOverdue
Review draft3 days left
Plan offsitein 12 days
Overdue = red · due soon = yellow · plenty of time = green
Build an overdue-date formatter → Opens the generator on the Days Remaining template.

Three useful date templates

Days remaining

Shows a colored badge with the number of days left, turning red once the date is in the past. Best for due-date and deadline columns. Open this template →

Relative date

Replaces the date with friendly wording — "Today", "Tomorrow", "in 5 days", "2 days ago". Great for activity and follow-up lists. Open this template →

Date stepper

Adds − and + buttons so you can nudge a date forward or back a day right in the list view, without opening the item. Open this template →

How to apply it

  1. Open the generator on a date template (links above).
  2. Enter your column's internal field name.
  3. Click Copy.
  4. In SharePoint: Column settings → Format this column → Advanced mode, paste, Preview, Save.
Column type matters: these templates expect a Date and time column. And as always, the field name must be your internal field name, not the display name.

Common questions

Why does my empty date show "Overdue"?
An empty date can read as far in the past. The current templates handle this and show "No date set" instead — make sure you're using the latest copy from the generator.
Can people still edit the date?
Yes — the badge templates are click-to-edit, so clicking the cell opens SharePoint's native date picker. The stepper template changes the date directly with its buttons.