{
  "colors": [
    {
      "name": "Twinfig blue",
      "group": "Core",
      "token": "--fig",
      "hex": "#2F6BFF",
      "rgb": "47, 107, 255",
      "hsl": "223°, 100%, 59%",
      "cmyk": "82, 58, 0, 0",
      "pantone": "2727 C",
      "use": "The accent. One primary action or highlight per view."
    },
    {
      "name": "Navy",
      "group": "Core",
      "token": "--navy",
      "hex": "#00154B",
      "rgb": "0, 21, 75",
      "hsl": "223°, 100%, 15%",
      "cmyk": "100, 72, 0, 71",
      "pantone": "2758 C",
      "use": "Dark surfaces, the top of the sky."
    },
    {
      "name": "Ink",
      "group": "Core",
      "token": "--ink",
      "hex": "#11141C",
      "rgb": "17, 20, 28",
      "hsl": "224°, 24%, 9%",
      "cmyk": "39, 29, 0, 89",
      "pantone": "Black 6 C",
      "use": "Text and the mono logo."
    },
    {
      "name": "Paper",
      "group": "Core",
      "token": "--paper",
      "hex": "#FAFBFE",
      "rgb": "250, 251, 254",
      "hsl": "225°, 67%, 99%",
      "cmyk": "2, 1, 0, 0",
      "pantone": null,
      "use": "Page ground."
    },
    {
      "name": "Lens",
      "group": "Blues",
      "token": "--fig-lens",
      "hex": "#E2ECFF",
      "rgb": "226, 236, 255",
      "hsl": "219°, 100%, 94%",
      "cmyk": "11, 7, 0, 0",
      "pantone": null,
      "use": "The lens on light. Tinted fills."
    },
    {
      "name": "Ice",
      "group": "Blues",
      "token": "--fig-ice",
      "hex": "#8EB6FF",
      "rgb": "142, 182, 255",
      "hsl": "219°, 100%, 78%",
      "cmyk": "44, 29, 0, 0",
      "pantone": null,
      "use": "Gradient highlight."
    },
    {
      "name": "Bright",
      "group": "Blues",
      "token": "--fig-bright",
      "hex": "#6EA1FF",
      "rgb": "110, 161, 255",
      "hsl": "219°, 100%, 72%",
      "cmyk": "57, 37, 0, 0",
      "pantone": null,
      "use": "Accent on dark."
    },
    {
      "name": "Indigo",
      "group": "Blues",
      "token": "--fig-indigo",
      "hex": "#1B3BD6",
      "rgb": "27, 59, 214",
      "hsl": "230°, 78%, 47%",
      "cmyk": "87, 72, 0, 16",
      "pantone": "2726 C",
      "use": "Gradient shadow."
    },
    {
      "name": "Deep",
      "group": "Blues",
      "token": "--fig-deep",
      "hex": "#0B45C7",
      "rgb": "11, 69, 199",
      "hsl": "221°, 90%, 41%",
      "cmyk": "94, 65, 0, 22",
      "pantone": "2728 C",
      "use": "Accent text on light."
    },
    {
      "name": "Soft",
      "group": "Blues",
      "token": "--fig-soft",
      "hex": "#E7EEFF",
      "rgb": "231, 238, 255",
      "hsl": "223°, 100%, 95%",
      "cmyk": "9, 7, 0, 0",
      "pantone": null,
      "use": "Selected and hover fills."
    },
    {
      "name": "Slate",
      "group": "Depth",
      "token": "--slate",
      "hex": "#2C3972",
      "rgb": "44, 57, 114",
      "hsl": "229°, 44%, 31%",
      "cmyk": "61, 50, 0, 55",
      "pantone": null,
      "use": "Back tile, top-left."
    },
    {
      "name": "Depth",
      "group": "Depth",
      "token": "--depth",
      "hex": "#0B1333",
      "rgb": "11, 19, 51",
      "hsl": "228°, 65%, 12%",
      "cmyk": "78, 63, 0, 80",
      "pantone": null,
      "use": "Back tile, bottom-right. Darkest surface."
    },
    {
      "name": "Ink 2",
      "group": "Neutrals",
      "token": "--ink-2",
      "hex": "#383F4D",
      "rgb": "56, 63, 77",
      "hsl": "220°, 16%, 26%",
      "cmyk": "27, 18, 0, 70",
      "pantone": null,
      "use": "Secondary text."
    },
    {
      "name": "Muted",
      "group": "Neutrals",
      "token": "--muted",
      "hex": "#717888",
      "rgb": "113, 120, 136",
      "hsl": "222°, 9%, 49%",
      "cmyk": "17, 12, 0, 47",
      "pantone": null,
      "use": "Labels and captions."
    },
    {
      "name": "Border",
      "group": "Neutrals",
      "token": "--border",
      "hex": "#E1E5EE",
      "rgb": "225, 229, 238",
      "hsl": "222°, 28%, 91%",
      "cmyk": "5, 4, 0, 7",
      "pantone": null,
      "use": "Card and window borders."
    },
    {
      "name": "Hairline",
      "group": "Neutrals",
      "token": "--hairline",
      "hex": "#E9ECF2",
      "rgb": "233, 236, 242",
      "hsl": "220°, 26%, 93%",
      "cmyk": "4, 2, 0, 5",
      "pantone": null,
      "use": "Dividers."
    },
    {
      "name": "Canvas",
      "group": "Neutrals",
      "token": "--canvas",
      "hex": "#F3F5F9",
      "rgb": "243, 245, 249",
      "hsl": "220°, 33%, 96%",
      "cmyk": "2, 2, 0, 2",
      "pantone": null,
      "use": "Behind product shots."
    },
    {
      "name": "White",
      "group": "Neutrals",
      "token": "--white",
      "hex": "#FFFFFF",
      "rgb": "255, 255, 255",
      "hsl": "0°, 0%, 100%",
      "cmyk": "0, 0, 0, 0",
      "pantone": null,
      "use": "Cards, the mono logo on colour."
    }
  ],
  "gradients": {
    "twin": {
      "name": "Twin",
      "angle": 135,
      "stops": [
        [
          0,
          "#8EB6FF"
        ],
        [
          0.42,
          "#3D78FF"
        ],
        [
          1,
          "#1B3BD6"
        ]
      ],
      "use": "The front tile, buttons, the second tittle."
    },
    "lens": {
      "name": "Lens",
      "angle": 135,
      "stops": [
        [
          0,
          "#E2ECFF"
        ],
        [
          1,
          "#8FB4FF"
        ]
      ],
      "use": "The overlap on light."
    },
    "slate": {
      "name": "Slate",
      "angle": 135,
      "stops": [
        [
          0,
          "#2C3972"
        ],
        [
          1,
          "#0B1333"
        ]
      ],
      "use": "The back tile on light."
    },
    "frost": {
      "name": "Frost",
      "angle": 135,
      "stops": [
        [
          0,
          "#FFFFFF"
        ],
        [
          1,
          "#D8E3FF"
        ]
      ],
      "use": "The back tile on dark."
    },
    "deep": {
      "name": "Deep lens",
      "angle": 135,
      "stops": [
        [
          0,
          "#1A3BC4"
        ],
        [
          1,
          "#0A1F78"
        ]
      ],
      "use": "The overlap on dark."
    },
    "glow": {
      "name": "Glow",
      "angle": 150,
      "stops": [
        [
          0,
          "#8EB6FF"
        ],
        [
          0.45,
          "#2F6BFF"
        ],
        [
          1,
          "#1631B8"
        ]
      ],
      "use": "Blue surfaces and app icons."
    },
    "night": {
      "name": "Night",
      "angle": 180,
      "stops": [
        [
          0,
          "#00154B"
        ],
        [
          0.55,
          "#0A2C9A"
        ],
        [
          0.82,
          "#2F6BFF"
        ],
        [
          1,
          "#9EC0FF"
        ]
      ],
      "use": "Social and slide backgrounds."
    },
    "sky": {
      "name": "Sky",
      "angle": 180,
      "stops": [
        [
          0,
          "#00154B"
        ],
        [
          0.19,
          "#001852"
        ],
        [
          0.35,
          "#001F63"
        ],
        [
          0.45,
          "#012672"
        ],
        [
          0.58,
          "#033596"
        ],
        [
          0.645,
          "#0844B6"
        ],
        [
          0.71,
          "#1760ED"
        ],
        [
          0.74,
          "#377BFF"
        ],
        [
          0.774,
          "#5E96FF"
        ],
        [
          0.806,
          "#84AFFF"
        ],
        [
          0.839,
          "#A4C4FF"
        ],
        [
          0.903,
          "#CFE0FF"
        ],
        [
          0.968,
          "#EFF5FF"
        ],
        [
          1,
          "#FAFBFE"
        ]
      ],
      "use": "The website hero: navy into blue into paper."
    }
  }
}