@deveditor/tailwind-config

Tailwind CSS preset for @deveditor/ui design tokens.

Install

pnpm add @deveditor/tailwind-config

Usage

Tailwind v4 (with @config in your CSS):

@import "tailwindcss";
@config "../../tailwind.config.js";

// tailwind.config.js
const { deveditorPreset } = require('@deveditor/tailwind-config');

module.exports = {
  presets: [deveditorPreset],
  content: [
    './src/**/*.{ts,tsx}',
    './node_modules/@deveditor/ui/dist/**/*.{js,mjs}',
  ],
};

Your app must define the CSS variables in :root and .dark (e.g. in globals.css). See @deveditor/ui or the consuming app’s design system for token values.

Preset

The preset extends Tailwind theme with:

• Colors: background, foreground, primary, secondary, muted, accent, destructive, border, input, ring, card, popover, brand, success, warning, info (and *-foreground variants).
• Border radius: lg, md, sm using var(--radius).

All values reference CSS variables (e.g. var(--primary)), so light/dark and theming are controlled in your CSS.