VVibeFlui

Presets

Theme presets provide default Tailwind class names and variant groups.

Preset keys

TS
theme: {
  preset: "default"
}
TS
theme: {
  preset: "tailadmin"
}
TS
theme: {
  preset: "shadcn"
}
TS
theme: {
  preset: "custom"
}

Default preset

The default preset defines practical Tailwind classes for root layout, table, form, field, modal, action button, empty state, and loading state slots.

TailAdmin preset

The tailadmin preset changes spacing, rounding, table density, form controls, page surfaces, modal/drawer styling, and action button variants.

Shadcn preset

The shadcn preset is defined in core by extending the default preset with Shadcn-direction class names for table wrapper, modal, and input slots.

Custom preset

custom starts from empty classNames and empty variants. Use it when the schema should provide all theme slots.

TS
theme: {
  preset: "custom",
  classNames: {
    root: "space-y-4",
    table: "w-full text-sm",
    actionButton: "inline-flex items-center rounded-md px-3 py-2"
  }
}

Common mistakes

  • Presets do not install external UI libraries.
  • Use custom only when the schema or app supplies enough slots for the UI being rendered.
  • Treat adapter: "tailadmin" as adapter metadata and default theme direction. Import optional plugin assets separately when the app needs them.