Create distinctive, production-grade frontend interfaces with high design quality. Use this when building web components, pages, artifacts, posters, or applications (websites, landing pages, react components). Generates creative, polished code that avoids generic aesthetics.
Create distinctive, production-grade UI visuals across web and native: layout, typography, color, hierarchy, and aesthetic direction that avoid generic "AI slop". Use whenever the goal is visual design quality, aesthetic direction, or beautifying an interface (web, React Native, or native). Do NOT use for state management, data fetching, rendering performance, or framework/component architecture (use senior-frontend), or for animation and gesture mechanics (use motion-craft).
Build modern, performant frontend UIs: component design, state management, rendering performance, and accessibility. Covers React and Next.js (web) plus React Native, with framework-specific mechanics in reference files; the judgment applies cross-framework. Use whenever the user builds or optimizes UI components, manages client or server state, or fixes frontend performance including list virtualization and scroll or render jank (e.g. FlatList). Do NOT use for visual or aesthetic design direction (use frontend-design), or for animation and gesture craft (use motion-craft).
Build or change a page, view or data-driven feature in the Next.js frontend — a route under the dashboard, wiring UI to a backend endpoint, a Zustand store, a permission that must hide a control, or localized copy. Use for any work in frontend/src, including "the page renders but shows an empty state" and "this button should not be visible to a Viewer".
Implements user interface work state by state: empty, loading, error, partial, and degenerate content, with native elements, derived state, and keyboard support. Use when building or changing a component, page, form, or flow, or when a UI change needs to hold up outside the happy path.
Build or modify frontend interfaces using repository-native components while preserving accessibility, responsive behavior, state handling, and visual verification. Use for UI features, design implementation, forms, client-side defects, and frontend refactors; do not use for backend-only or infrastructure-only work.
Visual design and aesthetic direction for frontend interfaces. Use when building web pages, landing pages, dashboards, Next.js server components, or applications where visual identity matters. For React patterns and testing, use react-frontend.
Subject-matter expert for the Council of AI (councilof.ai) front end — its architecture, the EU-gov-style library IA, the 8 content sectors, the naming canon, the deploy path, and the align-not-delete cleanup process. Load for any councilof.ai front-end work: cleanup, alignment, new pages, deploys.
Convert text into beautiful Xiaohongshu (小红书 / RED) image carousels. Use when the user wants to make 小红书图片、RED notes、图文笔记、图片排版、九宫格、朋友圈/微博图片. Generates 1080×1440 (3:4) or 1080×1080 (1:1) cards as a single HTML preview plus an optional Playwright script that exports each card to PNG. Includes 12 curated styles tuned for Chinese typography (奶油拿铁、莫兰迪、多巴胺、校园手账、极简黑白、港风胶片、杂志大字、暗黑科技、国风水墨、日系治愈、复古杂志、咖啡店黑板).
Use this skill when asked to integrate the Zama Relayer SDK, build a frontend for an FHEVM contract, connect a React app to a confidential smart contract, encrypt inputs in the browser, user decrypt encrypted values, public decrypt revealed values, implement EIP-712 signing for fhEVM, initialize a Relayer SDK instance, handle encrypted balances in UI, build a confidential token frontend, integrate MetaMask with fhEVM, or display decrypted results from an encrypted smart contract.
Create distinctive, production-grade frontend interfaces with high design quality. Use when building or refining web components, pages, or apps (HTML/CSS/JS/React) with bold aesthetics, purposeful layouts, motion, and accessibility. Avoid generic AI-looking output.
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
Plain text files in a repository that tell a coding agent how the project works: commands to run, conventions to follow and things to avoid. CLAUDE.md, AGENTS.md, cursor rules and skills are the common kinds.
CLAUDE.md or AGENTS.md?
CLAUDE.md is read by Claude Code. AGENTS.md is an open format that Codex, Cursor and other agents read. Many projects keep one and point the other at it.
What is a skill?
A folder with a SKILL.md that describes one capability, such as filling PDFs or reviewing code. The agent loads it only when the task calls for it.
Can I search my own team's files too?
Your agents already can, over MCP, limited to the files you're allowed to read. Searching them from this page is coming.