AI Playbooks Playground

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

[Agent-Ready] Playbooks include machine-readable Intent Schemas. Run npx agnosticui-cli context after installing a playbook and your AI agent automatically receives its structural recipe — component roles, layout hints, and trigger phrases it can match against user prompts.

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.