Explorar skills

Generates high-converting landing pages as complete Next.js/React (TSX) components with Tailwind CSS. Creates hero sections, feature grids, pricing tables, FAQ accordions, testimonial blocks, and CTA sections using proven copy frameworks (PAS, AIDA, BAB). Outputs SEO meta tags, structured data, and performance-optimised code targeting Core Web Vitals (LCP < 1s, CLS < 0.1). Use when the user asks t

Esta skill gera mockups de wireframe estruturais em preto e branco, utilizando um sistema de design específico com bordas tracejadas, fonte monoespaçada e tons de cinza. Ela é usada quando o usuário solicita um wireframe, mockup ou protótipo de baixa fidelidade similar, produzindo páginas de wireframe React + Tailwind CSS autocontidas.

Gerador de sistema de tipografia do Google Fonts que sugere fontes únicas (modo estrito) e pares de fontes (modo contraste) com escalas tipográficas completas baseadas nos conceitos de ritmo do Tailwind Typography, gerando propriedades CSS personalizadas, configuração do Tailwind e links de incorporação.

Conjunto de ferramentas para criar artefatos HTML elaborados e multicomponentes para claude.ai, utilizando tecnologias web frontend modernas (React, Tailwind CSS, shadcn/ui). Use para artefatos complexos que exigem gerenciamento de estado, roteamento ou componentes shadcn/ui, não para artefatos HTML/JSX simples de arquivo único.

This skill should be used when reviewing or auditing existing CSS code for consistency with established patterns. Triggers on "review CSS", "audit styles", "check CSS", "validate stylesheet", "CSS review". Checks semantic naming, dark mode coverage, Tailwind usage, and test coverage.

Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js performance, analyzing bundle sizes, scaffolding frontend projects, implementing accessibility, or reviewing frontend code quality.

UI/UX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code. Pr

Generate modern UI components — cards, forms, navigation, modals, tables, hero sections, footers, and pricing tables. 2026 glassmorphism design with Tailwind CSS. Copy-paste ready.

Generates complete, production-ready SaaS project boilerplate including authentication, database schemas, billing integration, API routes, and a working dashboard using Next.js 14+ App Router, TypeScript, Tailwind CSS, shadcn/ui, Drizzle ORM, and Stripe. Use when the user wants to create a new SaaS app, start a subscription-based web project, scaffold a Next.js application, or mentions terms like

This skill should be used when working with CSS, creating components, styling elements, refactoring styles, or reviewing CSS code. Triggers on "CSS", "styles", "Tailwind", "dark mode", "component styling", "semantic class", "@apply", "stylesheet". Routes to specialized sub-skills for creation, validation, or refactoring.

Documentação completa do shadcn/ui, apresentando componentes lindamente projetados com Radix UI e Tailwind CSS. Inclui instalação, componentes, temas, formulários, gráficos e integrações de frameworks para copiar e colar em seus aplicativos.

Dada uma URL pública, abre-a em um navegador real para capturar screenshots, estilos computados e sinais de nível. As descobertas são então traduzidas para um design.md calibrado, Atoms.tsx mínimo, página de sandbox e regras CLAUDE.md, com foco na visão, pois como modelo multimodal, você deve ler as screenshots e considerar arquivos JSON como fonte secundária.