UNPKG

@dbs-portal/core-theme

Version:

Theme management, styling utilities, and design tokens for DBS Portal

175 lines 5.52 kB
/** * Design tokens for typography * Following modern typography scales and best practices */ export declare const fontFamily: { readonly sans: readonly ["Inter", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "sans-serif"]; readonly serif: readonly ["Georgia", "Cambria", "Times New Roman", "Times", "serif"]; readonly mono: readonly ["JetBrains Mono", "Fira Code", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"]; }; export declare const fontSize: { readonly xs: readonly ["0.75rem", { readonly lineHeight: "1rem"; }]; readonly sm: readonly ["0.875rem", { readonly lineHeight: "1.25rem"; }]; readonly base: readonly ["1rem", { readonly lineHeight: "1.5rem"; }]; readonly lg: readonly ["1.125rem", { readonly lineHeight: "1.75rem"; }]; readonly xl: readonly ["1.25rem", { readonly lineHeight: "1.75rem"; }]; readonly xxl: readonly ["1.5rem", { readonly lineHeight: "2rem"; }]; readonly '3xl': readonly ["1.875rem", { readonly lineHeight: "2.25rem"; }]; readonly '4xl': readonly ["2.25rem", { readonly lineHeight: "2.5rem"; }]; readonly '5xl': readonly ["3rem", { readonly lineHeight: "1"; }]; readonly '6xl': readonly ["3.75rem", { readonly lineHeight: "1"; }]; readonly '7xl': readonly ["4.5rem", { readonly lineHeight: "1"; }]; readonly '8xl': readonly ["6rem", { readonly lineHeight: "1"; }]; readonly '9xl': readonly ["8rem", { readonly lineHeight: "1"; }]; }; export declare const fontWeight: { readonly thin: "100"; readonly extralight: "200"; readonly light: "300"; readonly normal: "400"; readonly medium: "500"; readonly semibold: "600"; readonly bold: "700"; readonly extrabold: "800"; readonly black: "900"; }; export declare const lineHeight: { readonly none: "1"; readonly tight: "1.25"; readonly snug: "1.375"; readonly normal: "1.5"; readonly relaxed: "1.625"; readonly loose: "2"; readonly 3: ".75rem"; readonly 4: "1rem"; readonly 5: "1.25rem"; readonly 6: "1.5rem"; readonly 7: "1.75rem"; readonly 8: "2rem"; readonly 9: "2.25rem"; readonly 10: "2.5rem"; }; export declare const letterSpacing: { readonly tighter: "-0.05em"; readonly tight: "-0.025em"; readonly normal: "0em"; readonly wide: "0.025em"; readonly wider: "0.05em"; readonly widest: "0.1em"; }; export declare const typography: { readonly h1: { readonly fontSize: readonly ["2.25rem", { readonly lineHeight: "2.5rem"; }]; readonly fontWeight: "700"; readonly lineHeight: "1.25"; readonly letterSpacing: "-0.025em"; }; readonly h2: { readonly fontSize: readonly ["1.875rem", { readonly lineHeight: "2.25rem"; }]; readonly fontWeight: "700"; readonly lineHeight: "1.25"; readonly letterSpacing: "-0.025em"; }; readonly h3: { readonly fontSize: readonly ["1.5rem", { readonly lineHeight: "2rem"; }]; readonly fontWeight: "600"; readonly lineHeight: "1.375"; readonly letterSpacing: "0em"; }; readonly h4: { readonly fontSize: readonly ["1.25rem", { readonly lineHeight: "1.75rem"; }]; readonly fontWeight: "600"; readonly lineHeight: "1.375"; readonly letterSpacing: "0em"; }; readonly h5: { readonly fontSize: readonly ["1.125rem", { readonly lineHeight: "1.75rem"; }]; readonly fontWeight: "500"; readonly lineHeight: "1.5"; readonly letterSpacing: "0em"; }; readonly h6: { readonly fontSize: readonly ["1rem", { readonly lineHeight: "1.5rem"; }]; readonly fontWeight: "500"; readonly lineHeight: "1.5"; readonly letterSpacing: "0em"; }; readonly body1: { readonly fontSize: readonly ["1rem", { readonly lineHeight: "1.5rem"; }]; readonly fontWeight: "400"; readonly lineHeight: "1.625"; readonly letterSpacing: "0em"; }; readonly body2: { readonly fontSize: readonly ["0.875rem", { readonly lineHeight: "1.25rem"; }]; readonly fontWeight: "400"; readonly lineHeight: "1.5"; readonly letterSpacing: "0em"; }; readonly caption: { readonly fontSize: readonly ["0.75rem", { readonly lineHeight: "1rem"; }]; readonly fontWeight: "400"; readonly lineHeight: "1.5"; readonly letterSpacing: "0.025em"; }; readonly overline: { readonly fontSize: readonly ["0.75rem", { readonly lineHeight: "1rem"; }]; readonly fontWeight: "500"; readonly lineHeight: "1.5"; readonly letterSpacing: "0.1em"; readonly textTransform: "uppercase"; }; }; export type FontFamily = keyof typeof fontFamily; export type FontSize = keyof typeof fontSize; export type FontWeight = keyof typeof fontWeight; export type LineHeight = keyof typeof lineHeight; export type LetterSpacing = keyof typeof letterSpacing; export type TypographyVariant = keyof typeof typography; //# sourceMappingURL=typography.d.ts.map