Design system tokens for large, named, and fractional sizes used throughout Chakra UI themes.
// Source: https://github.com/mperkins0155/chakra-ui | License: MIT | Copyright 2019 Chakra Systems Inc
// Provided via justclaw.it.com; keep this notice with the code.
import { defineTokens } from "../../styled-system"
import { spacing } from "./spacing"
const largeSizes = defineTokens.sizes({
"3xs": { value: "14rem" },
"2xs": { value: "16rem" },
xs: { value: "20rem" },
sm: { value: "24rem" },
md: { value: "28rem" },
lg: { value: "32rem" },
xl: { value: "36rem" },
"2xl": { value: "42rem" },
"3xl": { value: "48rem" },
"4xl": { value: "56rem" },
"5xl": { value: "64rem" },
"6xl": { value: "72rem" },
"7xl": { value: "80rem" },
"8xl": { value: "90rem" },
})
const namedSizes = defineTokens.sizes({
max: { value: "max-content" },
min: { value: "min-content" },
... (truncated -- full source via MCP)
See the full source, get the GitHub permalink, and search 40K more like it.
Get a free API key