{
  "source": "https://www.brim.finance/brand",
  "groups": [
    {
      "group": "Anchors",
      "colors": [
        {
          "name": "Brim Blue",
          "hex": "#5BB6F0",
          "rgb": [
            91,
            182,
            240
          ],
          "use": "The water: the level in the mark, fills, active links, focus rings."
        },
        {
          "name": "Brim Green",
          "hex": "#C0EA5C",
          "rgb": [
            192,
            234,
            92
          ],
          "use": "The drop: the i's tittle, the mascot's drip, the highlighter. A signal, never a background."
        }
      ]
    },
    {
      "group": "Neutrals",
      "colors": [
        {
          "name": "Ink",
          "hex": "#141414",
          "rgb": [
            20,
            20,
            20
          ],
          "use": "Lines, headlines, primary buttons, and all text on Blue or Green."
        },
        {
          "name": "Text",
          "hex": "#2A2823",
          "rgb": [
            42,
            40,
            35
          ],
          "use": "Running text."
        },
        {
          "name": "Muted",
          "hex": "#6E675B",
          "rgb": [
            110,
            103,
            91
          ],
          "use": "Captions, labels, eyebrows."
        },
        {
          "name": "Paper",
          "hex": "#FFFEF8",
          "rgb": [
            255,
            254,
            248
          ],
          "use": "The page ground."
        },
        {
          "name": "White",
          "hex": "#FFFFFF",
          "rgb": [
            255,
            255,
            255
          ],
          "use": "The vessel's body: the mascot, the mark, cards."
        }
      ]
    },
    {
      "group": "Grounds",
      "colors": [
        {
          "name": "Sand",
          "hex": "#F3E8C8",
          "rgb": [
            243,
            232,
            200
          ],
          "use": "The yellow paper's ground."
        },
        {
          "name": "Blue wash",
          "hex": "#EDF7FE",
          "rgb": [
            237,
            247,
            254
          ],
          "use": "The First Fill page and social cards: the air above the water."
        },
        {
          "name": "Green wash",
          "hex": "#ECF8D5",
          "rgb": [
            236,
            248,
            213
          ],
          "use": "Soft fills in the First Fill diagrams, a tint of the signal."
        }
      ]
    },
    {
      "group": "Dark mode",
      "colors": [
        {
          "name": "Night ground",
          "hex": "#141414",
          "rgb": [
            20,
            20,
            20
          ],
          "use": "The page ground in dark mode."
        },
        {
          "name": "Night surface",
          "hex": "#1E1C18",
          "rgb": [
            30,
            28,
            24
          ],
          "use": "Cards and the vessel's body in dark mode."
        },
        {
          "name": "Night ink",
          "hex": "#F1ECE1",
          "rgb": [
            241,
            236,
            225
          ],
          "use": "Lines and headlines in dark mode; the on-dark logos use it."
        },
        {
          "name": "Night text",
          "hex": "#D9D3C6",
          "rgb": [
            217,
            211,
            198
          ],
          "use": "Running text in dark mode."
        },
        {
          "name": "Night muted",
          "hex": "#A59E90",
          "rgb": [
            165,
            158,
            144
          ],
          "use": "Captions and labels in dark mode."
        }
      ]
    }
  ],
  "tints": [
    {
      "name": "Blue highlight",
      "css": "rgba(91,182,240,.16)",
      "use": "Hover and selection fills (22% in dark mode)."
    },
    {
      "name": "Hairline",
      "css": "rgba(20,20,20,.16)",
      "use": "Rules and quiet borders (Night ink at 16% in dark mode)."
    },
    {
      "name": "Green marker",
      "css": "linear-gradient(transparent 60%, #C0EA5C 60%)",
      "use": "The highlighter under Ink text (green at 30% in dark mode)."
    }
  ]
}