Color-Coding SharePoint List Date Column - Between Date Ranges

Thamires Bastos 20 Reputation points

Hello everyone! I need help figuring out a code that changes the color of a Due Date column based on date intervals, in my SharePoint List.

What I need is:

Task that is overdue - date column to be colored red;

Task that is from 1 and 7 days to be overdue - date column to be colored orange;

Task that is from 8 to 20 days to be overdue - date column to be colored yellow;

Task that is from 21 to 30 days to be overdue - date column to be colored green.

I am currently using this code here:

{ "$schema": "", "elmType": "div", "txtContent": "@currentField", "style": { "background-color": "=if(@currentField <= @now, 'red', if(@currentField <= @now + 604800000, 'orange', if(@currentField <= @now + 7776000000, 'yellow', if(@currentField >= 1728000000, 'green','')))" }


Your help will be deeply appreaciated!

A group of Microsoft Products and technologies used for sharing and managing content, knowledge, and applications.
8,030 questions
0 comments No comments
{count} votes

Accepted answer
  1. RaytheonXie_MSFT 24,121 Reputation points Microsoft Vendor

    Hi @Thamires Bastos,

    Per my test, you can use following json formatting to reach your requirement.

      "$schema": "",
      "elmType": "div",
      "txtContent": "@currentField",
      "style": {
        "background-color": "=if(@currentField >= @now - 86400000 && @currentField < @now, 'red', if(@currentField >= @now - 604800000 && @currentField < @now - 86400000, 'orange', if(@currentField >= @now - 1728000000 && @currentField < @now - 604800000, 'yellow', if(@currentField >= @currentField - 2592000000 && @currentField < @now - 1728000000, 'green','')))"

    If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    1 person found this answer helpful.

0 additional answers

Sort by: Most helpful