adx design system

The parts Autodocs is built from.

Every block below is the live component from @goodwill/autodocs-ui — the same code that renders the product, not a picture of it. The app shows this identical guide under Settings → Design System.

Foundations

Colour, type, materials and icons — what everything else is built from.

Navigation

Getting around a document: crumbs, tabs, panels and the workflow stepper.

Actions

Buttons, icon buttons, links and the badges that label a row.

Forms

Every input in the system, plus the settings-band layout they sit in.

Data

Tables, cards and the document-summary pieces that carry the numbers.

Feedback

Banners, modals, drawers and the four empty states.