Earthy Terracotta

Export tokens

:root {
  --primary: #C36F4E;
  --accent: #E2A76F;
  --surface: #E8D6B3;
  --secondary: #7D8C5C;
  --text: #4A5D43;
}

$earthy-terracotta-primary: #C36F4E;
$earthy-terracotta-accent: #E2A76F;
$earthy-terracotta-surface: #E8D6B3;
$earthy-terracotta-secondary: #7D8C5C;
$earthy-terracotta-text: #4A5D43;

// tailwind.config.js — theme.extend.colors
colors: {
  'earthy-terracotta': {
    'primary': '#C36F4E',
    'accent': '#E2A76F',
    'surface': '#E8D6B3',
    'secondary': '#7D8C5C',
    'text': '#4A5D43',
  },
}

{
    "earthy-terracotta": {
        "primary": {
            "value": "#C36F4E",
            "type": "color"
        },
        "accent": {
            "value": "#E2A76F",
            "type": "color"
        },
        "surface": {
            "value": "#E8D6B3",
            "type": "color"
        },
        "secondary": {
            "value": "#7D8C5C",
            "type": "color"
        },
        "text": {
            "value": "#4A5D43",
            "type": "color"
        }
    }
}

{
    "primary": "#C36F4E",
    "accent": "#E2A76F",
    "surface": "#E8D6B3",
    "secondary": "#7D8C5C",
    "text": "#4A5D43"
}

/* Paste into Canva → Brand Kit → Brand Colors */
#C36F4E
#E2A76F
#E8D6B3
#7D8C5C
#4A5D43

How the roles work