Getting StartedInstallation and setup guides 5
LayoutWorkflow and structural layout components 7
OverlayModal and floating layer surfaces 3
FeedbackStatus, empty, progress, and loading placeholder patterns 5
FormInput and selection components 17
UtilityGeneral-purpose interface utilities 7
NavigationMenu surfaces and hierarchical actions 7
Overview API Styling Examples

Examples

Common tng-form-field patterns with explicit Plain-CSS and Tailwind CSS shell examples.

Form usage

Use the form-field wrapper as the visual shell for native form controls and helper actions.

Form field form usage

Live form

Search command center

Combine prefixes, suffixes, and a native input inside a real submit-ready form row.

Ctrl+K

Use the wrapper to keep prefix, input, and suffix semantics grouped inside one field.

Global search field

Search field with an icon prefix and keyboard-hint suffix.

Global search field (Plain-CSS)

Ctrl+K

Workspace slug field

Editable workspace slug paired with a fixed suffix domain.

Workspace slug field (Plain-CSS)

.tailng.dev

Clear action field

Trailing action button inside the shared shell.

Clear action field (Plain-CSS)