# Tools

> Every listed resource, editors’ picks first. The filters below can be combined.

- Search: append `?q=<keywords>` to the URL. Separate several keywords with spaces; all of them must match. Matches name, repository, tags, professions, description and README.
- Filter by type: append `?type=<cli|skill|plugin|mcp>` to the URL.
- Filter by profession: append `?profession=<profession id>` to the URL. Separate several ids with commas; a resource matches when it suits any of them. Ids are listed at https://hebbmind.com/api/v1/professions
- Filter by tag: append `?tag=<tag>` to the URL. Separate several tags with commas; a resource must carry all of them. Tags are listed at https://hebbmind.com/api/v1/tags

Tagged `react`, `tailwind`: 11 items.

- [Web Artifacts Builder](https://hebbmind.com/es/skill/web-artifacts-builder.md): [Skill] Builds multi-component web pages that need state or routing with React, Tailwind CSS and shadcn/ui, using bundled init and build scripts, then packs them into a single HTML file for a claude.ai Artifact. Official Anthropic skill.
- [shadcn/ui](https://hebbmind.com/es/skill/shadcn.md): [Skill] Official shadcn/ui skill: uses the shadcn CLI to read project config and component docs, then adds, searches, composes and fixes components following styling, form and accessibility rules. Can also start new projects from presets.
- [shadcn CLI](https://hebbmind.com/es/cli/shadcn.md): [CLI] Official shadcn/ui CLI: initializes projects and adds component source to your codebase on demand, with switchable presets. Since v4 it offers --dry-run and --diff so agents can preview changes, and it comes with an agent skill.
- [shadcn MCP Server](https://hebbmind.com/es/mcp/shadcn-ui-mcp.md): [MCP] MCP server built into the official shadcn CLI: lets agents browse and search components, blocks and templates in any configured registry, including private ones, and install them into your project in plain language. The project needs a components.json.
- [Design Lab](https://hebbmind.com/es/skill/design-lab.md): [Skill] Interviews you on scope, pain points and brand tone, infers the visual language from existing styles, and builds five React UI variants on a temporary route with a feedback overlay. Iterates on feedback, then writes an implementation plan and deletes the temp files.
- [Interactive Hit Areas](https://hebbmind.com/es/skill/interactive-hit-areas.md): [Skill] Fixes hover and click dead zones between spaced interactive elements such as chart bars, list rows, tabs and nav items by making hit targets flush and moving visual spacing inside each item, with React and Tailwind examples.
- [Paper to Code Components](https://hebbmind.com/es/skill/paper-to-code-components.md): [Skill] Turns Paper designs (via Paper MCP, Viewfinder or exported JSX) into componentized React/Next.js code: maps hierarchy and reusable components first, one component per icon, tokens in globals.css, shadcn reuse, real fonts and data-driven charts.
- [Animate UI](https://hebbmind.com/es/skill/animate-ui.md): [Skill] Prototyper UI's animation conventions for writing, reviewing or debugging component motion: copy-paste class strings for overlays, dialogs and sheets, press-feedback scales, state transitions, easing tokens and prefers-reduced-motion handling.
- [Build Primitive](https://hebbmind.com/es/skill/build-primitive.md): [Skill] Guides building Prototyper UI components from scratch when no Base UI primitive exists: ARIA contract first, then keyboard navigation, focus management, controlled and uncontrolled state, form integration and animation, wrapping headless libraries where they fit.
- [Create Component](https://hebbmind.com/es/skill/create-component.md): [Skill] End-to-end guide for adding components to the Prototyper UI library: templates for wrapping Base UI primitives with CVA variants and compound sub-components, plus registry entries, examples and MDX documentation pages.
- [Prototyper UI](https://hebbmind.com/es/skill/prototyper-ui.md): [Skill] Usage guide for the Prototyper UI component library, built on @base-ui/react and Tailwind CSS v4 with copy-paste distribution, OKLCH colors and CVA variants: setup, theme tokens, component selection and patterns, noting render= replaces Radix asChild.