Arctic Frost

Export tokens

:root {
  --surface: #F0F7FF;
  --secondary: #CDE7FF;
  --accent: #A5D0FF;
  --primary: #7FB3E8;
  --text: #4A7BA7;
}

$arctic-frost-surface: #F0F7FF;
$arctic-frost-secondary: #CDE7FF;
$arctic-frost-accent: #A5D0FF;
$arctic-frost-primary: #7FB3E8;
$arctic-frost-text: #4A7BA7;

// tailwind.config.js — theme.extend.colors
colors: {
  'arctic-frost': {
    'surface': '#F0F7FF',
    'secondary': '#CDE7FF',
    'accent': '#A5D0FF',
    'primary': '#7FB3E8',
    'text': '#4A7BA7',
  },
}

{
    "arctic-frost": {
        "surface": {
            "value": "#F0F7FF",
            "type": "color"
        },
        "secondary": {
            "value": "#CDE7FF",
            "type": "color"
        },
        "accent": {
            "value": "#A5D0FF",
            "type": "color"
        },
        "primary": {
            "value": "#7FB3E8",
            "type": "color"
        },
        "text": {
            "value": "#4A7BA7",
            "type": "color"
        }
    }
}

{
    "surface": "#F0F7FF",
    "secondary": "#CDE7FF",
    "accent": "#A5D0FF",
    "primary": "#7FB3E8",
    "text": "#4A7BA7"
}

/* Paste into Canva → Brand Kit → Brand Colors */
#F0F7FF
#CDE7FF
#A5D0FF
#7FB3E8
#4A7BA7

How the roles work