Frontend

PhongLee1210/cursor-rules-craft

Cursor rule Cursor

File structure and naming conventions for frontend and backend applications in the monorepo.

kimzeze/frontend-conventions

Skill Claude CodeCodex

Locks in opinionated frontend code patterns for Next.js 16 + TanStack Query v5 + FSD projects. ALWAYS invoke when writing data-fetching code (NEVER useEffect+fetch — always TanStack Query), creating forms (always react-hook-form + zod), introducing client state (Zustand for client-global only — NEVER for server data…

jaansokk/cursor_tools

Skill Claude Code

Create distinctive, production-grade web interfaces with high design quality using Tailwind CSS. Use for building UI components, pages, dashboards, apps, and web applications. Generates crafted, polished code that avoids generic AI aesthetics.

MaxVelocityLabs/React-typescript-scss-boilerplate

Cursor rule Cursor

Always setup ESLint with proper JSON configuration including import sorting and grouping rules for React projects.

stevennana/mina-ralph-loop-bootstrap-nextjs

Skill Codex

Bootstrap or extend a new or early-stage Next.js App Router + TypeScript repository around a Ralph-style task-promotion loop. Use when Codex needs to ask the founder product and architecture questions, generate or update the repo-local markdown knowledge base, create the initial scaffold or the next feature wave…

All-The-Vibes/ATV-PaperBoard

Plugin Claude Code

Bundles 1 plugin

Cross-harness HTML artifact toolkit. Enforce, render, persist, compound.

PhelipeG/daily_habits_app_angular_ia

Skill Claude CodeCodex

Use when profiling or optimizing this Angular 21 habits app for faster initial load, smaller bundles, smoother rendering, or reduced change-detection work. Covers route-level code splitting, @defer, signals/computed state, template hot paths, and validation of performance changes.

JohnWayneeee/ai-agent-skills

Skill Claude Code

Generate and deploy a complete brand asset pack for a Next.js App Router project. Scans the project, prints what to generate with exact specs, then imports and wires everything correctly.

AkshitIreddy/agent-skills

Skill Claude CodeCodex

Measure synthesized Web Audio when implementing sound effects or diagnosing playback and sound-quality defects.

ChuluuMGL/business-website-skill

Skill Codex

A guide for building client-ready business websites from source materials such as existing sites, documents, images, and presentation files. It focuses on clear business information, evidence, examples, process, and ways for visitors to make contact.

OthmanAdi/vibe-skills

Skill Claude CodeCodex

Generate and deploy production-grade websites from a natural language description. Use when asked to "vibe a site", "vibe code this", "build me a website and publish it", "create a landing page and deploy it", "make a portfolio site and put it online", "generate a site and ship it", or any request combining website…

cwklurks/ship-score

Skill Claude CodeCodex

You are running the Performance category of a Ship Score production readiness audit. Follow every instruction below precisely. Do not add checks beyond the 7 defined here. Do not skip checks. Report exactly what you find.

XINGANLIU/design-system-generator-skill

Skill Claude Code

Generate a complete, production-ready design system from a single brand color. Outputs OKLCH color palettes, W3C Design Tokens (JSON), CSS custom properties, component styles (Button, Card, Input, Badge, Alert, Modal, etc.), and a live preview HTML page with Light/Dark theme toggle. Trigger this skill when the user…

trinhhaox/ag-kit

Agent Claude Code

Senior Frontend Architect who builds maintainable React/Next.js systems with performance-first mindset. Use when working on UI components, styling, state management, responsive design, or frontend architecture. Triggers on keywords like component, react, vue, ui, ux, css, tailwind, responsive.

pnaque/pnaque_codex-universal-design-skill

Skill Claude CodeCodex

High-fidelity HTML design and prototype creation for both Claude Code and OpenAI Codex. Use this skill whenever the user asks to design, prototype, mock up, or build visual artifacts in HTML — including slide decks, interactive prototypes, landing pages, UI mockups, animations, or any visual design work. Also use when…

ryo-manba/stylelint-mcp

MCP server Claude CodeCodexCursor +2

MCP server for Stylelint. Runs locally from the stylelint-mcp npm package.

josemartinrodriguezmortaloni/webSearch-Tools

MCP server Claude CodeCodexCursor +2

Web application development framework. Runs locally from the webtools Python package.

PiuQiuPiaQia/mcp-tool

Cursor rule Cursor

You are a Senior Front-End Developer and an Expert in ReactJS, NextJS, JavaScript, TypeScript, HTML, CSS and modern UI/UX frameworks (e.g., TailwindCSS, Shadcn, Radix). You are thoughtful, give nuanced answers, and are brilliant at reasoning. You carefully provide accurate, factual, thoughtful answers, and are a…

RookieCol/debridge-mcp

Cursor rule Cursor

Use Bun instead of Node.js, npm, pnpm, or vite.

Zwe1/Figma-Context-MCP

MCP server Claude CodeCodexCursor +2

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot. Runs locally from the figma-developer-mcp npm package.

matipojo/simple-storybook-preview-mcp

MCP server Claude CodeCodexCursor +2

MCP server that renders Storybook component previews inside the IDE. Runs locally from the simple-storybook-preview-mcp npm package.

sankalpmukim/ibm-cloud-docs-mcp-server

Cursor rule Cursor

Cursor rule "use-bun-instead-of-node-vite-npm-pnpm" from sankalpmukim/ibm-cloud-docs-mcp-server, covering apis and frontend.

Conce-AI/v0.dev

MCP server Claude CodeCodexCursor +2

A powerful Model Context Protocol (MCP) server that integrates v0.dev AI capabilities for modern web development. Powered by Bun for 25x faster performance. Runs locally from the v0-mcp-ts npm package.

skylarbarrera/react-devtools-mcp

Skill Claude CodeCodex

Debug React apps by inspecting runtime state, props, hooks, and renders.