Cotton Candy

Export tokens

:root {
  --primary: #FFAFCC;
  --surface: #FFC8DD;
  --text: #CDB4DB;
  --secondary: #BDE0FE;
  --accent: #A2D2FF;
}

$cotton-candy-primary: #FFAFCC;
$cotton-candy-surface: #FFC8DD;
$cotton-candy-text: #CDB4DB;
$cotton-candy-secondary: #BDE0FE;
$cotton-candy-accent: #A2D2FF;

// tailwind.config.js — theme.extend.colors
colors: {
  'cotton-candy': {
    'primary': '#FFAFCC',
    'surface': '#FFC8DD',
    'text': '#CDB4DB',
    'secondary': '#BDE0FE',
    'accent': '#A2D2FF',
  },
}

{
    "cotton-candy": {
        "primary": {
            "value": "#FFAFCC",
            "type": "color"
        },
        "surface": {
            "value": "#FFC8DD",
            "type": "color"
        },
        "text": {
            "value": "#CDB4DB",
            "type": "color"
        },
        "secondary": {
            "value": "#BDE0FE",
            "type": "color"
        },
        "accent": {
            "value": "#A2D2FF",
            "type": "color"
        }
    }
}

{
    "primary": "#FFAFCC",
    "surface": "#FFC8DD",
    "text": "#CDB4DB",
    "secondary": "#BDE0FE",
    "accent": "#A2D2FF"
}

/* Paste into Canva → Brand Kit → Brand Colors */
#FFAFCC
#FFC8DD
#CDB4DB
#BDE0FE
#A2D2FF

How the roles work