Ce contenu n'est pas encore disponible dans votre langue et est affiché en anglais.

shadcn/Tailwind Layouts

Skill Vérifié

Generate correct shadcn/Tailwind layouts by applying CSS mental models. This skill should be used when the user asks to 'create a shadcn layout', 'fix layout issues', 'debug CSS height problems', 'make scrolling work', or has issues with Tailwind flex/grid. Keywords: shadcn, Tailwind, layout, CSS, flex, grid, height, scroll, overflow.

Résumé IA

This skill explains fundamental CSS layout principles like height inheritance and flexbox behavior, which are often misunderstood by AI agents. It offers detailed explanations, common patterns, and diagnostic steps for resolving layout issues in shadcn/ui and Tailwind CSS projects.

Versioning

info:Release ManagementA version ('1.0') is present in the SKILL.md frontmatter, but there are no GitHub release tags or CHANGELOG, and the commit date is unavailable.

Installation

npx skills add jwynia/agent-skills

Exécute le CLI skills de Vercel (skills.sh) via npx — nécessite Node.js en local et au moins un agent compatible skills installé (Claude Code, Cursor, Codex, …). Suppose que le dépôt suit le format agentskills.io.

2 months ago

jwynia

70 stars

MIT

Mis à jour le 2 days ago

Voir le code source

Extensions similaires

Frontend Design

Create distinctive, production-grade frontend interfaces with high design quality. Provides analysis tools for auditing existing designs and generation tools for creating color palettes, typography systems, design tokens, and component templates. Supports React, Vue, Svelte, and vanilla HTML/CSS. Use when building web components, pages, or applications. Keywords: design, UI, frontend, CSS, components, palette, typography, tokens, accessibility.

Skill

jwynia

Frontend Design

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

Skill

bytedance

Frontend Design Skill

Transform UI style requirements into production-ready frontend code with systematic design tokens, accessibility compliance, and creative execution. Use when building websites, web applications, React/Vue components, dashboards, landing pages, or any web UI requiring both design consistency and aesthetic quality.

Skill

answerzhao

react-is

Brand checking of React Elements.

Skill

facebook

TanStack React Start Patterns

TanStack React Start auth patterns with @clerk/tanstack-react-start - createServerFn, beforeLoad guards, loaders, Vinxi server. Triggers on: TanStack auth, createServerFn clerk, beforeLoad protection, TanStack Start middleware.

Skill

clerk

Next.js: useSearchParams with Suspense Pattern

Pattern for using useSearchParams hook with Suspense boundary in Next.js. Covers the required combination of 'use client' directive and Suspense wrapper when accessing URL query parameters in client components. Use when building search interfaces, filters, pagination, or any feature that needs to read/manipulate URL query parameters client-side.

Skill

wsimmonds