AI Playbooks Playground

UI patterns built with AgnosticUI, available in React, Vue, and Lit.

Theme Playground: Use the palette button in the bottom-right corner to pick a skin, extract a theme from an image, or paste custom CSS vars. Your theme persists as you navigate between playbooks.

Playbooks

Login FormSplit-screen and gradient card variants for authentication flows.Onboarding WizardMulti-step onboarding flow with progress tracking and transitions.Discovery DashboardData-rich dashboard with charts, metrics cards, and activity feeds.Support CenterHelp desk interface with ticket management and knowledge base search.Data GridHigh-performance table with sorting, filtering, and pagination.Blog / Article ReaderClean reading experience with navigation, sidebar, and typography focus.Landing / Marketing PageConversion-focused marketing page with hero, features, and CTA sections.Contact Form (FACE)Form-associated custom elements — fully accessible, native form integration.