franken-ui
Version:
Franken UI is an HTML-first, open-source library of UI components based on the utility-first Tailwind CSS with UIkit 3 compatibility. The design is based on shadcn/ui ported to be framework-agnostic.
35 lines (34 loc) • 1.5 kB
JavaScript
import defaultTheme from 'tailwindcss/defaultTheme.js';
/** @type {import('tailwindcss').Config} */
export default {
darkMode: 'class',
theme: {
extend: {
colors: {
background: 'hsl(var(--background))',
foreground: 'hsl(var(--foreground))',
muted: 'hsl(var(--muted))',
'muted-foreground': 'hsl(var(--muted-foreground))',
card: 'hsl(var(--card))',
'card-foreground': 'hsl(var(--card-foreground))',
popover: 'hsl(var(--popover))',
'popover-foreground': 'hsl(var(--popover-foreground))',
border: 'hsl(var(--border))',
input: 'hsl(var(--input))',
primary: 'hsl(var(--primary))',
'primary-foreground': 'hsl(var(--primary-foreground))',
secondary: 'hsl(var(--secondary))',
'secondary-foreground': 'hsl(var(--secondary-foreground))',
accent: 'hsl(var(--accent))',
'accent-foreground': 'hsl(var(--accent-foreground))',
destructive: 'hsl(var(--destructive))',
'destructive-foreground': 'hsl(var(--destructive-foreground))',
ring: 'hsl(var(--ring))'
},
fontFamily: {
'geist-sans': ['Geist Sans', ...defaultTheme.fontFamily.sans],
'geist-mono': ['Geist Mono', ...defaultTheme.fontFamily.mono]
}
}
}
};