frontend-toolkit

Frontend Toolkit Blocks A curated collection of responsive Vue 3 component layouts, page blocks, and premium UI assets — ready to copy, paste, and ship. Built with Vue 3, TypeScript, Tailwind CSS v4, and Vite. Features Copy & Paste Ready — Every component is self-contained Fully Responsive — Mobile-first design that works on every screen size Dark Mode — Built-in dark/light theme support TypeScript — Full type safety with strict typing Tailwind CSS v4 — Modern utility-first styling with CSS-first configuration Vue 3 Composition API — Uses and composables What's Included Page Blocks HeroBlock — Hero section with gradient text, badge, and dual CTAs FeaturesBlock — Configurable feature grid with icons (2/3/4 columns) PricingBlock — Three-tier pricing cards with popular plan highlighting CtaBlock — Call-to-action with gradient background and optional email input ContentBlock — Split content section with stats and testimonials Page Layouts DashboardLayout — Admin dashboard with collapsible sidebar, search, stats, and responsive mobile nav AuthLayout — Split-screen authentication with social login and branding panel UI Components ThemeToggle — Dark/light mode toggle using VueUse