Guides

Using Forui À La Shadcn/ui

Take full ownership of Forui's behavior and layout by editing widget source directly.

This approach is only recommended for advanced users. Consider using the built-in styling system and CLI instead.

Shadcn/ui popularized copying component source into your project and editing it directly. You can do the same with Forui using dart pub unpack.

Unlike shadcn/ui, which is a thin styling layer over headless components, Forui is fully self-contained. Unpacking gives you ownership of everything, including accessibility, gesture handling and layout, not just styling.

In practice, this means more fine-grained control at the cost of a greater maintenance burden.

This approach is best suited for building your own tailored design system using Forui as a base.

Unpacking

To unpack Forui's source locally, run:

dart pub unpack forui -o <output>

Then depend on the local copy in your pubspec.yaml:

dependencies:
  forui:
    path: <output>

Consider setting up a Dart workspace to manage the unpacked package alongside your main project.

On this page