{
    "name": "Flayr brand palette",
    "version": "2027",
    "source": "https://www.flayrfx.com/brand#colour",
    "colours": [
        {
            "group": "Core",
            "name": "Flayr Navy",
            "hex": "#1B2B48",
            "rgb": [
                27,
                43,
                72
            ],
            "cmyk": [
                94,
                82,
                44,
                44
            ],
            "cmyk_calculated": false,
            "pantone_coated": "PANTONE 5255 C",
            "pantone_uncoated": "PANTONE 5255 U",
            "role": "The primary brand colour. Backgrounds, wordmark, headings, and every dark surface."
        },
        {
            "group": "Core",
            "name": "Flayr Teal",
            "hex": "#58C0B3",
            "rgb": [
                88,
                192,
                179
            ],
            "cmyk": [
                62,
                1,
                36,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": "PANTONE 338 C",
            "pantone_uncoated": "PANTONE 338 U",
            "role": "The signature accent. The mark, highlights, links, and calls to action."
        },
        {
            "group": "Core",
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ],
            "cmyk": [
                0,
                0,
                0,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Primary background in light contexts and the reversed logo colour."
        },
        {
            "group": "Extended",
            "name": "Deep Teal",
            "hex": "#3F8C85",
            "rgb": [
                63,
                140,
                133
            ],
            "cmyk": [
                76,
                28,
                49,
                5
            ],
            "cmyk_calculated": false,
            "pantone_coated": "PANTONE 7717 C",
            "pantone_uncoated": "PANTONE 7717 U",
            "role": "Teal at depth. Hover states, secondary charts, and teal text on white where contrast matters."
        },
        {
            "group": "Extended",
            "name": "Mint",
            "hex": "#A8EFE5",
            "rgb": [
                168,
                239,
                229
            ],
            "cmyk": [
                30,
                0,
                4,
                6
            ],
            "cmyk_calculated": true,
            "pantone_coated": "PANTONE 331 C",
            "pantone_uncoated": "PANTONE 331 U",
            "role": "Light teal wash for tints, backgrounds, and highlight fills."
        },
        {
            "group": "Extended",
            "name": "Cyan Pop",
            "hex": "#43D8CA",
            "rgb": [
                67,
                216,
                202
            ],
            "cmyk": [
                69,
                0,
                6,
                15
            ],
            "cmyk_calculated": true,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "The brightest circle in the mark. Reserve for small emphasis only."
        },
        {
            "group": "Extended",
            "name": "Slate",
            "hex": "#343B49",
            "rgb": [
                52,
                59,
                73
            ],
            "cmyk": [
                78,
                68,
                50,
                43
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Neutral dark for body copy on light, and panels that must sit back from navy."
        },
        {
            "group": "Extended",
            "name": "Slate Mid",
            "hex": "#5F6D82",
            "rgb": [
                95,
                109,
                130
            ],
            "cmyk": [
                67,
                52,
                35,
                10
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Secondary text, captions, metadata, and dividers."
        },
        {
            "group": "Extended",
            "name": "Ink",
            "hex": "#0D1625",
            "rgb": [
                13,
                22,
                37
            ],
            "cmyk": [
                65,
                41,
                0,
                85
            ],
            "cmyk_calculated": true,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Deepest tone. Video letterboxing, code surfaces, and true-black alternatives."
        },
        {
            "group": "Accent",
            "name": "Signal Blue",
            "hex": "#577EF2",
            "rgb": [
                87,
                126,
                242
            ],
            "cmyk": [
                68,
                52,
                0,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Digital-only accent for interactive states and data. Never in the logo."
        },
        {
            "group": "Accent",
            "name": "Blue Light",
            "hex": "#8FABEF",
            "rgb": [
                143,
                171,
                239
            ],
            "cmyk": [
                42,
                27,
                0,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Supporting tint for Signal Blue in charts and diagrams."
        },
        {
            "group": "Neutral",
            "name": "Grey Light",
            "hex": "#CDD0D7",
            "rgb": [
                205,
                208,
                215
            ],
            "cmyk": [
                18,
                13,
                10,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Rules, borders, disabled states, and placeholder fills."
        },
        {
            "group": "Neutral",
            "name": "Off White",
            "hex": "#F2F2F2",
            "rgb": [
                242,
                242,
                242
            ],
            "cmyk": [
                4,
                2,
                2,
                0
            ],
            "cmyk_calculated": false,
            "pantone_coated": null,
            "pantone_uncoated": null,
            "role": "Page background and card surfaces where pure white is too stark."
        }
    ],
    "ui_tokens": [
        {
            "token": "--bg",
            "hex": "#FAFAFC",
            "use": "Page background — every page, public and admin"
        },
        {
            "token": "--surface",
            "hex": "#FFFFFF",
            "use": "Cards, tiles, panels"
        },
        {
            "token": "--surface-2",
            "hex": "#F2F2F5",
            "use": "Fills inside white cards: inputs, secondary buttons"
        },
        {
            "token": "--surface-3",
            "hex": "#E8E8ED",
            "use": "Hover fills, switches off"
        },
        {
            "token": "--ink",
            "hex": "#0D1625",
            "use": "Headings"
        },
        {
            "token": "--text",
            "hex": "#343B49",
            "use": "Body text"
        },
        {
            "token": "--muted",
            "hex": "#5F6D82",
            "use": "Secondary text, captions"
        },
        {
            "token": "--faint",
            "hex": "#8A93A5",
            "use": "Hints, placeholders, disabled"
        },
        {
            "token": "--teal-ink",
            "hex": "#2E766F",
            "use": "Teal for small text and links on light: passes AA"
        },
        {
            "token": "--mint",
            "hex": "#C2F2E9",
            "use": "The light circle in the 2027 mark; highlight fills"
        },
        {
            "token": "--mint-soft",
            "hex": "#E7F7F4",
            "use": "Callouts, the active menu item"
        },
        {
            "token": "--navy",
            "hex": "#1B2B48",
            "use": "Primary buttons, dark tiles"
        }
    ]
}