frontend-ui
fossasia/eventyay/.agents/skills/frontend-ui/SKILL.md
Frontend UI implementation, accessibility, and responsive checks for Django templates and Vue components
Steady9 mentions in 2 weeks
4 projects use a version of this
Skills real projects publish on GitHub, most starred first. Each one says what it will make an agent do before you copy it.
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
fossasia/eventyay/.agents/skills/frontend-ui/SKILL.md
Frontend UI implementation, accessibility, and responsive checks for Django templates and Vue components
Steady9 mentions in 2 weeks
4 projects use a version of this
langflow-ai/langflow/.agents/skills/frontend-i18n/SKILL.md
Add, change, or review user-facing text in the Langflow frontend using the i18n system (i18next / react-i18next). Use whenever a change adds or edits UI strings — labels, buttons, tooltips, modals, toasts, error messages, empty states — or when reviewing a diff that contains user-facing text. Every user-facing string must go through the translation system and every new key must exist in ALL locale files. Do NOT use for backend strings, log messages, or code identifiers.
2 projects use a version of this
mealie-recipes/mealie/.claude/skills/frontend-e2e/SKILL.md
Run Mealie's backend and frontend dev servers and drive the UI in a real browser with the Playwright MCP. Use when building or debugging a frontend feature, reproducing a UI bug, checking a change visually (desktop or mobile), taking screenshots for a PR, or writing and running a Playwright spec in tests/e2e.
Steady22 mentions in 2 weeks
No other project uses it yet
BankrBot/openclaw-skills/ethskills-frontend-ux/SKILL.md
Frontend UX rules for Ethereum dApps — mandatory patterns for onchain buttons, four-state connect flows, token approval sequences, address display, USD values, and RPC configuration.
1 project uses a version of this
codicis-ai/taskplex/skills/frontend/SKILL.md
Build production-grade frontend interfaces with design system awareness, accessibility, responsive patterns, and component architecture. Use this skill when building UI components, pages, or applications — whether a new feature, redesign, or component library work. Triggers on "build a component", "create a page", "design the UI", "add a form", "build a dashboard", "responsive layout", "fix the styling", "component library", "design system", "accessibility audit", "WCAG", "mobile layout", "CSS refactor", "frontend", "UI", "UX". Works standalone in any coding agent. Integrates with TaskPlex when running via /tp.
futhr/futhr/.agents/skills/frontend/SKILL.md
Edit or review Svelte components, SvelteKit routes, component tests, and Storybook stories in this workspace. Use when changing reactivity, component APIs, rendered HTML, disclosure behaviour, SSR boundaries, or story composition. ExkPasswd's plain TypeScript browser shell follows its package guide.
gabros20/frontend-skill/skills/frontend/SKILL.md
Implement production frontend code for websites, web apps, iOS, and Android, from creative website builds and faithful site rebuilds to dense product UI: components, state, data fetching, forms, auth flows, chat and agent-run UIs, routing, responsive accessible interfaces, performance, client security, and tests. Covers React, Next.js, Tailwind, shadcn/ui, SwiftUI, Jetpack Compose, and React Native, and consumes a design handoff (handoff.yaml, DESIGN.md). Do not use for design direction, motion or animation implementation, SEO strategy, backend or system architecture, or QA audits unless the request also requires frontend implementation.
hilmifawwazsaad/NextJS-js-Boilerplate/.agents/frontend/SKILL.md
Generate production-grade Next.js (App Router) JSX code. Use for components, pages, layouts, and utilities — pure UI, no DB or server logic.
lucas-moraes/skills/skills/frontend/SKILL.md
This skill transforms UI requirements into highly reusable, accessible, and testable frontend component specifications and code.
marcusbelz/di2-starter-kit/.claude/skills/frontend/SKILL.md
Build UI components against the real APIs. Use after the backend is built (for features that need one). Default stack is React/Next/Tailwind/shadcn; adapt to the project's actual UI stack.
mj-deving/pai-skills/skills/Frontend/SKILL.md
Frontend design and website engineering — standards, anti-slop rules, aesthetic presets, website factory, design intelligence, audit commands, and site teardown. USE WHEN building UI, HTML, frontend, design review, responsive, website factory, portfolio site, landing page, impeccable, audit, typeset, animate, colorize, critique, layout, polish, delight, harden, site teardown, clone website, redesign.
stamat/claude/skills/frontend/SKILL.md
Rules for anything that renders HTML — accessibility, SEO and GEO built as one job for the non-visual reader. Use when writing or reviewing HTML, templates, components, ARIA, meta tags, structured data, sitemaps, llms.txt, or any page a browser, crawler or agent will read.
PostHog/posthog-foss/.agents/skills/qa-frontend/SKILL.md
Internal PostHog developer frontend/browser QA skill. Use only when a PostHog developer explicitly asks to run frontend QA, browser-test a PR, verify a UI flow against the local PostHog stack, use qa-frontend, or QA current frontend changes with browser/runtime evidence, or to make a feature reel (see reel mode below). Do not use for generic code review, PR review, "check my changes", CI debugging, or security audit; use qa-team, debugging-ci-failures, or security-audit instead. QA runs in PR mode or local mode, plans adaptive browser and visual checks, drives browser MCP/tooling such as Playwright MCP or Chrome DevTools MCP, captures evidence, and applies only approved/narrow fixes. Reel mode makes a feature reel instead: a short, sharp animated WebP of one UI flow for a PR description. Use it when asked for a reel, GIF, or animated demo, or when writing-pr-descriptions calls for a reel: a new action and its effect that one screenshot cannot show.
latitude-dev/latitude-llm/.agents/skills/web-frontend/SKILL.md
apps/web UI — routes, @repo/ui, TanStack Start server functions and collections, navigation (Link vs useNavigate), forms (useForm + createFormSubmitHandler + fieldErrorsAsStrings for Zod field errors), Tailwind layout rules, design-system updates, and useEffect / useMountEffect policy.
rlaope/oh-my-hermes/skills/omh-frontend/SKILL.md
[omh] Building or polishing a web or terminal UI: prepare design-system-driven web and terminal (TUI) UI creation, redesign, polish, accessibility, performance, and visual QA handoffs. Use when the user says: frontend, front-end, front end, frontend skill, in the frontend, on the frontend, to the frontend, web ui.
Steady4 mentions in 2 weeks
No other project uses it yet
bkywksj/knowledge-base/.claude/skills/ui-frontend/SKILL.md
React 前端 UI 组件开发技能,指导 Tauri 桌面应用的界面开发。
comet-ml/opik/.agents/skills/opik-frontend/SKILL.md
React frontend patterns for Opik. Use when working in apps/opik-frontend, on components, state, or data fetching.
Steady7 mentions in 2 weeks
No other project uses it yet
austintgriffith/ethskills/frontend-ux/SKILL.md
Use when building, fixing, or reviewing how an Ethereum dApp frontend behaves for its users: product identity, address inputs that resolve names, token amounts and decimals, approve-then-act flows, fiat context, the target chain. The completeness steps agents skip unprompted. Not for the Scaffold-ETH 2 pre-ship checklist (`/qa`).
suitenumerique/docs/.agents/skills/docs-frontend/SKILL.md
Work safely and efficiently on the Next.js frontend of La Suite Docs (src/frontend/apps/impress). Use this skill when modifying React components, hooks, API calls, TanStack Query, Zustand stores, the BlockNote editor, i18n strings, the service worker or offline behaviour, styles, or Vitest tests of the frontend.
Steady5 mentions in 2 weeks
No other project uses it yet
rommapp/romm/.claude/skills/frontend-i18n/SKILL.md
Internationalization for the RomM frontend. Use whenever adding, renaming, or removing any user-visible string / translation key under frontend/src/locales/. Covers the en_US-is-source rule, the requirement to add every new key to ALL locale directories in the same change, namespace layout, and the check_i18n_locales.py validator enforced in CI. Trigger on any change to frontend/src/locales/**.
A folder with a SKILL.md file: a name, a description of when to use it, and instructions. Claude loads a skill only when the task matches its description.
Copy the folder into your project's .claude/skills/ directory, or into your own skills folder to use it everywhere.
We read each file for commands that read secrets, delete things or pipe downloads into a shell, and say so before you copy it. No warning is not a promise that a file is safe.
Open a skill to see its discussion. Reports from people and their agents are coming.