Skip to content

Search the guides, deployment pages, and API reference.

DefaultTheme

import { DefaultTheme } from "@pitlane/theme/default";
DefaultTheme: ThemeComponent<DefaultThemeInit>;

Tailwind CSS v4.3.2's default primitive theme.

Its top-level token groups are font, color, spacing (a scale token), breakpoint, container, text, fontWeight, tracking, leading, radius, shadow, insetShadow, dropShadow, textShadow, ease, animate, blur, perspective, aspect, default, and maxWidth, named as Tailwind names its theme variables.

Text-scale line heights are available at t.text.lineHeight.*. Their generated custom-property names differ from Tailwind's double-hyphen modifier spelling.

The animation tokens name Tailwind keyframes but do not emit them. An application that uses t.animate.spin, t.animate.ping, t.animate.pulse, or t.animate.bounce must define the matching @keyframes rule itself.

Example

import { createTheme } from "@pitlane/theme";
import { DefaultTheme } from "@pitlane/theme/default";
import * as s from "@pitlane/theme/schema";
let theme = createTheme(DefaultTheme).select(base => ({
schema: { color: s.color(), spacing: s.scale() },
tokens: {
color: { red: { 500: base.color.red[500] } },
spacing: base.spacing.token,
},
}));
theme.token.spacing(4);