{
  "$schema": "https://design-tokens.github.io/community-group/format/",
  "color": {
    "palette": {
      "mochi-pink": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.965,
            0.325,
            0.584
          ],
          "hex": "#f65395"
        },
        "$type": "color",
        "$description": "Mochi Pink"
      },
      "sunny-yellow": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            1,
            0.761,
            0.102
          ],
          "hex": "#ffc21a"
        },
        "$type": "color",
        "$description": "Sunny Yellow"
      },
      "sky-blue": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.522,
            0.784,
            0.957
          ],
          "hex": "#85c8f4"
        },
        "$type": "color",
        "$description": "Sky Blue"
      },
      "mint-teal": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.412,
            0.804,
            0.725
          ],
          "hex": "#69cdb9"
        },
        "$type": "color",
        "$description": "Mint Teal"
      },
      "soft-purple": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.604,
            0.471,
            0.89
          ],
          "hex": "#9a78e3"
        },
        "$type": "color",
        "$description": "Soft Purple"
      },
      "cream": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.973,
            0.941,
            0.89
          ],
          "hex": "#f8f0e3"
        },
        "$type": "color",
        "$description": "Cream"
      },
      "charcoal": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.169,
            0.169,
            0.169
          ],
          "hex": "#2b2b2b"
        },
        "$type": "color",
        "$description": "Charcoal"
      }
    },
    "semantic": {
      "primary": {
        "$value": "{color.palette.mochi-pink}",
        "$type": "color",
        "$description": "semantic: primary"
      },
      "accent": {
        "$value": "{color.palette.sunny-yellow}",
        "$type": "color",
        "$description": "semantic: accent"
      },
      "muted": {
        "$value": "{color.palette.sky-blue}",
        "$type": "color",
        "$description": "semantic: muted"
      },
      "neutral": {
        "$value": "{color.palette.mint-teal}",
        "$type": "color",
        "$description": "semantic: neutral"
      },
      "surface": {
        "$value": "{color.palette.cream}",
        "$type": "color",
        "$description": "semantic: surface"
      },
      "text": {
        "$value": "{color.palette.charcoal}",
        "$type": "color",
        "$description": "semantic: text"
      }
    },
    "dark": {
      "primary": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.965,
            0.325,
            0.584
          ],
          "hex": "#f65395"
        },
        "$type": "color",
        "$description": "dark: primary"
      },
      "accent": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            1,
            0.761,
            0.102
          ],
          "hex": "#ffc21a"
        },
        "$type": "color",
        "$description": "dark: accent"
      },
      "neutral": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.235,
            0.235,
            0.235
          ],
          "hex": "#3c3c3c"
        },
        "$type": "color",
        "$description": "dark: neutral"
      },
      "surface": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.169,
            0.169,
            0.169
          ],
          "hex": "#2b2b2b"
        },
        "$type": "color",
        "$description": "dark: surface"
      },
      "text": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.973,
            0.941,
            0.89
          ],
          "hex": "#f8f0e3"
        },
        "$type": "color",
        "$description": "dark: text"
      },
      "muted": {
        "$value": {
          "colorSpace": "srgb",
          "components": [
            0.522,
            0.784,
            0.957
          ],
          "hex": "#85c8f4"
        },
        "$type": "color",
        "$description": "dark: muted"
      }
    }
  },
  "gradient": {
    "brand": {
      "$type": "gradient",
      "$value": [
        {
          "color": "#F65395",
          "position": 0
        },
        {
          "color": "#FFC21A",
          "position": 0.25
        },
        {
          "color": "#69CDB9",
          "position": 0.5
        },
        {
          "color": "#85C8F4",
          "position": 0.75
        },
        {
          "color": "#F65395",
          "position": 1
        }
      ],
      "$description": "brand gradient — conic 90deg",
      "angle": 90,
      "position": "50% 50%",
      "gradientType": "conic",
      "css": "conic-gradient(from 90deg at 50% 50%, #F65395 0%, #FFC21A 25%, #69CDB9 50%, #85C8F4 75%, #F65395 100%)"
    }
  },
  "font": {
    "heading": {
      "$value": "Bowlby One",
      "$type": "fontFamily",
      "family": "Bowlby One",
      "source": "google",
      "importUrl": "https://fonts.googleapis.com/css2?family=Bowlby+One:wght@400;500;600;700&display=swap"
    },
    "body": {
      "$value": "DM Sans",
      "$type": "fontFamily",
      "family": "DM Sans",
      "source": "google",
      "importUrl": "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap"
    }
  },
  "typography": {
    "display": {
      "fontSize": {
        "$value": "2.441rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 700,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.1,
        "$type": "number"
      }
    },
    "h1": {
      "fontSize": {
        "$value": "1.953rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 700,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.15,
        "$type": "number"
      }
    },
    "h2": {
      "fontSize": {
        "$value": "1.563rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 600,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.2,
        "$type": "number"
      }
    },
    "h3": {
      "fontSize": {
        "$value": "1.25rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 600,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.3,
        "$type": "number"
      }
    },
    "body": {
      "fontSize": {
        "$value": "1rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 400,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.5,
        "$type": "number"
      }
    },
    "caption": {
      "fontSize": {
        "$value": "0.8rem",
        "$type": "dimension"
      },
      "fontWeight": {
        "$value": 400,
        "$type": "fontWeight"
      },
      "lineHeight": {
        "$value": 1.45,
        "$type": "number"
      }
    }
  },
  "spacing": {
    "xs": {
      "$value": "4px",
      "$type": "dimension"
    },
    "sm": {
      "$value": "8px",
      "$type": "dimension"
    },
    "md": {
      "$value": "16px",
      "$type": "dimension"
    },
    "lg": {
      "$value": "24px",
      "$type": "dimension"
    },
    "xl": {
      "$value": "32px",
      "$type": "dimension"
    },
    "2xl": {
      "$value": "48px",
      "$type": "dimension"
    },
    "3xl": {
      "$value": "64px",
      "$type": "dimension"
    }
  },
  "radius": {
    "sm": {
      "$value": "4px",
      "$type": "dimension"
    },
    "md": {
      "$value": "8px",
      "$type": "dimension"
    },
    "lg": {
      "$value": "16px",
      "$type": "dimension"
    },
    "full": {
      "$value": "9999px",
      "$type": "dimension"
    }
  },
  "shadow": {
    "sm": {
      "$value": "0 1px 2px rgba(0,0,0,0.06)",
      "$type": "shadow"
    },
    "md": {
      "$value": "0 4px 12px rgba(0,0,0,0.10)",
      "$type": "shadow"
    },
    "lg": {
      "$value": "0 12px 32px rgba(0,0,0,0.16)",
      "$type": "shadow"
    }
  },
  "brand": {
    "name": {
      "$value": "Mochi",
      "$type": "string"
    },
    "voice": {
      "$value": "Bright, not bubbly · Small-step encouraging · Playful with purpose · Kindly accountable · Clear and calming",
      "$type": "string"
    }
  },
  "contrast": [
    {
      "pair": "text-on-surface",
      "foreground": "#2B2B2B",
      "background": "#F8F0E3",
      "ratio": 12.52,
      "AA": true,
      "AALarge": true,
      "AAA": true,
      "passAA": true
    },
    {
      "pair": "text-on-neutral",
      "foreground": "#2B2B2B",
      "background": "#69CDB9",
      "ratio": 7.44,
      "AA": true,
      "AALarge": true,
      "AAA": true,
      "passAA": true
    },
    {
      "pair": "black-on-primary",
      "foreground": "#000000",
      "background": "#F65395",
      "ratio": 6.59,
      "AA": true,
      "AALarge": true,
      "AAA": false,
      "passAA": true
    },
    {
      "pair": "white-on-primary",
      "foreground": "#FFFFFF",
      "background": "#F65395",
      "ratio": 3.19,
      "AA": false,
      "AALarge": true,
      "AAA": false,
      "passAA": false
    }
  ],
  "contrastDark": [
    {
      "pair": "text-on-surface",
      "foreground": "#F8F0E3",
      "background": "#2B2B2B",
      "ratio": 12.52,
      "AA": true,
      "AALarge": true,
      "AAA": true,
      "passAA": true
    },
    {
      "pair": "text-on-neutral",
      "foreground": "#F8F0E3",
      "background": "#3c3c3c",
      "ratio": 9.75,
      "AA": true,
      "AALarge": true,
      "AAA": true,
      "passAA": true
    },
    {
      "pair": "black-on-primary",
      "foreground": "#000000",
      "background": "#F65395",
      "ratio": 6.59,
      "AA": true,
      "AALarge": true,
      "AAA": false,
      "passAA": true
    },
    {
      "pair": "white-on-primary",
      "foreground": "#FFFFFF",
      "background": "#F65395",
      "ratio": 3.19,
      "AA": false,
      "AALarge": true,
      "AAA": false,
      "passAA": false
    }
  ]
}
