Temas CSS

Presets, edição de tokens e preview de seções. O estado fica salvo no navegador.

Tokens ativos

Editando Corporativo. Alterações salvas no localStorage.

Primáriaprimary

Texto primárioprimaryForeground

Secundáriasecondary

Texto secundáriosecondaryForeground

Fundobackground

Textoforeground

Mutedmuted

Texto mutedmutedForeground

Accentaccent

Texto accentaccentForeground

Destrutivodestructive

Texto destrutivodestructiveForeground

Bordaborder

Focus ringring

Exportar CSS variables

.css-themes {
  --ct-color-primary: #2563eb;
  --ct-color-primary-foreground: #ffffff;
  --ct-color-secondary: #f1f5f9;
  --ct-color-secondary-foreground: #0f172a;
  --ct-color-background: #ffffff;
  --ct-color-foreground: #0f172a;
  --ct-color-muted: #f8fafc;
  --ct-color-muted-foreground: #64748b;
  --ct-color-accent: #f1f5f9;
  --ct-color-accent-foreground: #0f172a;
  --ct-color-destructive: #dc2626;
  --ct-color-destructive-foreground: #ffffff;
  --ct-color-border: #e2e8f0;
  --ct-color-ring: #2563eb;
  --ct-font-family: Inter, system-ui, sans-serif;
  --ct-font-family-heading: Inter, system-ui, sans-serif;
  --ct-font-size-base: 1rem;
  --ct-font-size-sm: 0.875rem;
  --ct-font-size-lg: 1.125rem;
  --ct-font-size-xl: 1.25rem;
  --ct-line-height-base: 1.5;
  --ct-font-weight-normal: 400;
  --ct-font-weight-medium: 500;
  --ct-font-weight-bold: 700;
  --ct-radius: 0.5rem;
  --ct-radius-sm: 0.25rem;
  --ct-radius-lg: 0.75rem;
  --ct-spacing-unit: 0.25rem;
}

Tokens ativos

Seções