Anthropic Color Palette

Select any value to copy it.

• Anthropic Dark

  Primary

  #141413rgb(20, 20, 19)hsl(60, 3%, 8%)

  Primary text and dark backgrounds. anthropic.com calls it Slate Dark.

  Closest in ArchiveTrue Gray Ink
  Closest in Archive: True Gray Ink

• Anthropic Light

  Background

  #FAF9F5rgb(250, 249, 245)hsl(48, 33%, 97%)

  Light backgrounds and text on dark. anthropic.com calls it Ivory Light.

  Closest in ArchiveSaffron Veil Soft
  Closest in Archive: Saffron Veil Soft

• Anthropic Orange

  Accent

  #D97757rgb(217, 119, 87)hsl(15, 63%, 60%)

  The primary accent. anthropic.com calls it Clay.

  Closest in ArchiveVermillion Tone Vivid
  Closest in Archive: Vermillion Tone Vivid

• Anthropic Blue

  Accent

  #6A9BCCrgb(106, 155, 204)hsl(210, 49%, 61%)

  Secondary accent.

  Closest in ArchiveSapphire Tone Clear
  Closest in Archive: Sapphire Tone Clear

• Anthropic Green

  Accent

  #788C5Drgb(120, 140, 93)hsl(86, 20%, 46%)

  Tertiary accent.

  Closest in ArchiveLime Core Muted
  Closest in Archive: Lime Core Muted

• Mid Gray

  Neutral

  #B0AEA5rgb(176, 174, 165)hsl(49, 7%, 67%)

  Secondary elements.

  Closest in ArchiveTaupe Gray Silk
  Closest in Archive: Taupe Gray Silk

• Light Gray

  Neutral

  #E8E6DCrgb(232, 230, 220)hsl(50, 21%, 89%)

  Subtle backgrounds.

  Closest in ArchiveSaffron Mist Dust
  Closest in Archive: Saffron Mist Dust

• Cream Canvas

  Background

  #F0EEE6rgb(240, 238, 230)hsl(48, 25%, 92%)

  A background tone on anthropic.com (Ivory Medium); not in the guideline list.

  Closest in ArchiveSaffron Whisper Soft
  Closest in Archive: Saffron Whisper Soft

• claude.ai Accent (2024)

  Accent

  #C96442rgb(201, 100, 66)hsl(15, 56%, 52%)

  One of three light-theme accent shades (--accent-main-200) in claude.ai's 2024 stylesheet. Today claude.ai and anthropic.com use #C6613F and #D97757; the guideline orange is #D97757.

  Closest in ArchiveVermillion Radiant Clear
  Closest in Archive: Vermillion Radiant Clear

• anthropic.com Dark (2023)

  Neutral

  #191919rgb(25, 25, 25)hsl(0, 0%, 10%)

  Text and button color on anthropic.com's 2023 site; the guideline dark is #141413.

  Closest in ArchiveTrue Gray Ink
  Closest in Archive: True Gray Ink

Can it carry text? (WCAG contrast)

Each color as text on white and on black. AA means body text passes. Select a ratio to open the pair in the contrast checker.

• Anthropic DarkAaon white18.43:1AAAnthropic Dark: Open in contrast checkerAaon black1.14:1Not for textAnthropic Dark: Open in contrast checker
• Anthropic LightAaon white1.05:1Not for textAnthropic Light: Open in contrast checkerAaon black19.93:1AAAnthropic Light: Open in contrast checker
• Anthropic OrangeAaon white3.12:1Large text onlyAnthropic Orange: Open in contrast checkerAaon black6.73:1AAAnthropic Orange: Open in contrast checker
• Anthropic BlueAaon white2.93:1Not for textAnthropic Blue: Open in contrast checkerAaon black7.17:1AAAnthropic Blue: Open in contrast checker
• Anthropic GreenAaon white3.68:1Large text onlyAnthropic Green: Open in contrast checkerAaon black5.71:1AAAnthropic Green: Open in contrast checker
• Mid GrayAaon white2.22:1Not for textMid Gray: Open in contrast checkerAaon black9.44:1AAMid Gray: Open in contrast checker
• Light GrayAaon white1.25:1Not for textLight Gray: Open in contrast checkerAaon black16.78:1AALight Gray: Open in contrast checker
• Cream CanvasAaon white1.16:1Not for textCream Canvas: Open in contrast checkerAaon black18.08:1AACream Canvas: Open in contrast checker
• claude.ai Accent (2024)Aaon white3.90:1Large text onlyclaude.ai Accent (2024): Open in contrast checkerAaon black5.39:1AAclaude.ai Accent (2024): Open in contrast checker
• anthropic.com Dark (2023)Aaon white17.58:1AAanthropic.com Dark (2023): Open in contrast checkerAaon black1.19:1Not for textanthropic.com Dark (2023): Open in contrast checker

About this palette

Anthropic (the maker of Claude) chose a deliberately understated palette — warm cream backgrounds and a soft near-black for text — to signal seriousness in a market crowded with neon-tech aesthetics. Its published brand guidelines pair those neutrals with one primary accent, Orange #D97757, and a muted blue and green as secondary accents. The result reads as research-led and considered, rather than consumer-AI-loud.

Copy as code

Every token name carries the brand, so two brands can share one stylesheet.

:root {
  --anthropic-dark: #141413;
  --anthropic-light: #faf9f5;
  --anthropic-orange: #d97757;
  --anthropic-blue: #6a9bcc;
  --anthropic-green: #788c5d;
  --anthropic-mid-gray: #b0aea5;
  --anthropic-light-gray: #e8e6dc;
  --anthropic-cream-canvas: #f0eee6;
  --anthropic-claude-ai-accent-2024: #c96442;
  --anthropic-com-dark-2023: #191919;
}

@theme {
  --color-anthropic-dark: #141413;
  --color-anthropic-light: #faf9f5;
  --color-anthropic-orange: #d97757;
  --color-anthropic-blue: #6a9bcc;
  --color-anthropic-green: #788c5d;
  --color-anthropic-mid-gray: #b0aea5;
  --color-anthropic-light-gray: #e8e6dc;
  --color-anthropic-cream-canvas: #f0eee6;
  --color-anthropic-claude-ai-accent-2024: #c96442;
  --color-anthropic-com-dark-2023: #191919;
}

module.exports = {
  theme: {
    extend: {
      colors: {
        "anthropic-dark": "#141413",
        "anthropic-light": "#faf9f5",
        "anthropic-orange": "#d97757",
        "anthropic-blue": "#6a9bcc",
        "anthropic-green": "#788c5d",
        "anthropic-mid-gray": "#b0aea5",
        "anthropic-light-gray": "#e8e6dc",
        "anthropic-cream-canvas": "#f0eee6",
        "anthropic-claude-ai-accent-2024": "#c96442",
        "anthropic-com-dark-2023": "#191919",
      },
    },
  },
};

Source: https://github.com/anthropics/skills/blob/main/skills/brand-guidelines/SKILL.md · As of 2026-09-28 · This page is an unofficial reference. Color values are factual sRGB hex codes and not subject to copyright; the Anthropic name and any associated marks belong to their owner. Request removal via support.

More from Tech & Hardware