Brand colors

Asana Brand Colors

Asana palette: #FC636B, #F92F60, #2A2A2A. Compare HEX/RGB, WCAG contrast and CSS tokens; open independent JSON data.

Commonly referenced brand color values. This page is an independent technical reference and is not affiliated with or endorsed by Asana.

Commonly referenced palette Asana
#FC636B#F92F60#2A2A2A
Listed without an implied color hierarchy

Palette

Palette color 1#FC636BRGB 252, 99, 107
Palette color 2#F92F60RGB 249, 47, 96
Palette color 3#2A2A2ARGB 42, 42, 42

CSS Tokens

:root {
  --brand-asana-1: #FC636B;
  --brand-asana-2: #F92F60;
  --brand-asana-3: #2A2A2A;
}

Accessibility Snapshot

#FC636BBlack 7.14:1 / White 2.94:1
#F92F60Black 5.6:1 / White 3.75:1
#2A2A2ABlack 1.46:1 / White 14.34:1

Brand palette context · Editorially reviewed

About Asana Brand Colors

Asana's three-dot symbol was rearranged in 2015 from a quiet line into a triangular group intended to show teammates working toward a shared goal. Coral replaced the earlier cool green, while a controlled glow suggested energy between the dots. The wider system balanced a clean white workspace—clarity—with selective bursts of color marking action and progress.

Coral, purple, and dark navy in this archive should not override Asana's live guidelines. Current rules require the coral symbol with a black wordmark on light backgrounds or white wordmark on black, prohibit recoloring and effects, and do not allow the symbol to stand alone. In product UI, status and ownership also need text, icons, and accessible contrast.

This independent reference does not distribute Asana assets, represent an integration or partner, imply endorsement, or grant permission to separate, recolor, animate, or otherwise modify its marks.

Downloadable brand colors infographic

Asana Brand Colors Infographic

Save an independent infographic of the commonly referenced Asana HEX palette and its accessibility guidance. No logo or proprietary artwork is included.

1200 × 800
Asana brand colors infographic showing its commonly referenced HEX palette and accessibility guidance for every listed color without assigning a color hierarchy.
Asana brand colors infographic. Commonly referenced brand color values. This page is an independent technical reference and is not affiliated with or endorsed by Asana.

Machine-readable data

Machine-Readable Brand Color Data (JSON)

Structured brand palette data for design systems, references, automations, and AI ingestion.

AI-Ready Dataset v1.0.0
Luminance0.3068
Black text7.14:1AA Pass
White text2.94:1AA Fail
hexCanonical HEX value
rgbRed, green, blue channels
hslHue, saturation, lightness
cmykApproximate print conversion
wcagAA and AAA contrast options
harmoniesMathematical harmony sets
variantsGenerated tone variants
nearestColorsKnowledge graph neighbors
Download JSON Open API
Structured sections
Brand
{
  "slug": "asana",
  "name": "Asana",
  "category": "technology",
  "brandCategory": [
    "Technology",
    "technology"
  ],
  "url": "https://www.colorsencyclopedia.com/brand-colors/asana/",
  "categoryUrl": "https://www.colorsencyclopedia.com/brand-colors/technology/",
  "disclaimer": "Commonly referenced brand color values. This page is an independent technical reference and is not affiliated with or endorsed by Asana."
}
Palette
[
  {
    "name": "Palette color 1",
    "hex": "#FC636B",
    "rgb": [
      252,
      99,
      107
    ],
    "hsl": [
      357,
      96,
      69
    ],
    "cmyk": [
      0,
      61,
      58,
      1
    ],
    "luminance": 0.3068,
    "contrast": {
      "black": 7.14,
      "white": 2.94
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": [
        "#000000"
      ]
    }
  },
  {
    "name": "Palette color 2",
    "hex": "#F92F60",
    "rgb": [
      249,
      47,
      96
    ],
    "hsl": [
      345,
      94,
      58
    ],
    "cmyk": [
      0,
      81,
      61,
      2
    ],
    "luminance": 0.2302,
    "contrast": {
      "black": 5.6,
      "white": 3.75
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": []
    }
  },
  {
    "name": "Palette color 3",
    "hex": "#2A2A2A",
    "rgb": [
      42,
      42,
      42
    ],
    "hsl": [
      0,
      0,
      16
    ],
    "cmyk": [
      0,
      0,
      0,
      84
    ],
    "luminance": 0.0232,
    "contrast": {
      "black": 1.46,
      "white": 14.34
    },
    "wcag": {
      "AA": [
        "#FFFFFF",
        "#F5F5F5"
      ],
      "AAA": [
        "#FFFFFF",
        "#F5F5F5"
      ]
    }
  }
]
AI context
{
  "brandUseCases": [
    "SaaS UI",
    "developer tools",
    "product branding",
    "brand reference",
    "design systems",
    "CSS tokens",
    "accessibility checks"
  ],
  "semanticGroups": [
    "technology brand colors",
    "red brand palette",
    "gray brand palette",
    "warm brand palette",
    "neutral brand palette",
    "vibrant brand color",
    "dark brand color",
    "Asana color reference"
  ],
  "contrastSafeWith": [
    "#000000",
    "#1A1A1A",
    "#FFFFFF",
    "#F5F5F5"
  ],
  "relatedEndpoints": [
    "https://www.colorsencyclopedia.com/api/brand-colors/asana.json",
    "https://www.colorsencyclopedia.com/api/brand-colors.json"
  ]
}
CSS tokens
{
  "css": "--brand-asana-1: #FC636B;\n--brand-asana-2: #F92F60;\n--brand-asana-3: #2A2A2A;"
}
Accessibility
[
  {
    "hex": "#FC636B",
    "contrast": {
      "black": 7.14,
      "white": 2.94
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": [
        "#000000"
      ]
    }
  },
  {
    "hex": "#F92F60",
    "contrast": {
      "black": 5.6,
      "white": 3.75
    },
    "wcag": {
      "AA": [
        "#000000",
        "#1A1A1A"
      ],
      "AAA": []
    }
  },
  {
    "hex": "#2A2A2A",
    "contrast": {
      "black": 1.46,
      "white": 14.34
    },
    "wcag": {
      "AA": [
        "#FFFFFF",
        "#F5F5F5"
      ],
      "AAA": [
        "#FFFFFF",
        "#F5F5F5"
      ]
    }
  }
]
Full JSON dataset
{
  "slug": "asana",
  "name": "Asana",
  "category": "technology",
  "brandCategory": [
    "Technology",
    "technology"
  ],
  "disclaimer": "Commonly referenced brand color values. This page is an independent technical reference and is not affiliated with or endorsed by Asana.",
  "datasetVersion": "1.0.0",
  "url": "https://www.colorsencyclopedia.com/brand-colors/asana/",
  "categoryUrl": "https://www.colorsencyclopedia.com/brand-colors/technology/",
  "apiUrl": "https://www.colorsencyclopedia.com/api/brand-colors/asana.json",
  "colors": [
    {
      "name": "Palette color 1",
      "hex": "#FC636B",
      "rgb": [
        252,
        99,
        107
      ],
      "hsl": [
        357,
        96,
        69
      ],
      "cmyk": [
        0,
        61,
        58,
        1
      ],
      "luminance": 0.3068,
      "contrast": {
        "black": 7.14,
        "white": 2.94
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A"
        ],
        "AAA": [
          "#000000"
        ]
      }
    },
    {
      "name": "Palette color 2",
      "hex": "#F92F60",
      "rgb": [
        249,
        47,
        96
      ],
      "hsl": [
        345,
        94,
        58
      ],
      "cmyk": [
        0,
        81,
        61,
        2
      ],
      "luminance": 0.2302,
      "contrast": {
        "black": 5.6,
        "white": 3.75
      },
      "wcag": {
        "AA": [
          "#000000",
          "#1A1A1A"
        ],
        "AAA": []
      }
    },
    {
      "name": "Palette color 3",
      "hex": "#2A2A2A",
      "rgb": [
        42,
        42,
        42
      ],
      "hsl": [
        0,
        0,
        16
      ],
      "cmyk": [
        0,
        0,
        0,
        84
      ],
      "luminance": 0.0232,
      "contrast": {
        "black": 1.46,
        "white": 14.34
      },
      "wcag": {
        "AA": [
          "#FFFFFF",
          "#F5F5F5"
        ],
        "AAA": [
          "#FFFFFF",
          "#F5F5F5"
        ]
      }
    }
  ],
  "brandUseCases": [
    "SaaS UI",
    "developer tools",
    "product branding",
    "brand reference",
    "design systems",
    "CSS tokens",
    "accessibility checks"
  ],
  "semanticGroups": [
    "technology brand colors",
    "red brand palette",
    "gray brand palette",
    "warm brand palette",
    "neutral brand palette",
    "vibrant brand color",
    "dark brand color",
    "Asana color reference"
  ],
  "contrastSafeWith": [
    "#000000",
    "#1A1A1A",
    "#FFFFFF",
    "#F5F5F5"
  ],
  "relatedEndpoints": [
    "https://www.colorsencyclopedia.com/api/brand-colors/asana.json",
    "https://www.colorsencyclopedia.com/api/brand-colors.json"
  ]
}