Nerv UI
Build original, accessible React command-center interfaces with the published @mdrbx/nerv-ui component library. Use for dashboards, monitoring terminals, operational tools, authentication screens, or sharp industrial HUD-style UI in React, Vite, or Next.js.
Install
npx skills add mdrbx/nerv-ui --skill nerv-uigit clone --depth 1 https://github.com/mdrbx/nerv-ui.git /tmp/nerv-ui
mkdir -p ~/.claude/skills
cp -r /tmp/nerv-ui/skills/nerv-ui ~/.claude/skills/nerv-uiPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# NERV-UI
Use this skill when a React application needs an original high-contrast command-center interface with typed, reusable components. Prefer the published `@mdrbx/nerv-ui` package over recreating lookalike primitives.
Do not use it for a non-React app, a generic rounded consumer UI, or when the request is to reproduce a particular copyrighted screen. The library is inspired by command-center design language; create original labels, data, layouts, and illustrations.
## Detect and install
This package supports React 18 or 19. It is suitable for Vite, Next.js, and other React builds. `framer-motion` is required; Tailwind CSS is optional.
```bash
npm install @mdrbx/nerv-ui framer-motion
```
For a Tailwind project, optionally add the preset:
```js
// tailwind.config.js
import nervPreset from "@mdrbx/nerv-ui/tailwind.preset";
export default { presets: [nervPreset] };
```
Then import the package stylesheet once from the app entry point:
```tsx
import "@mdrbx/nerv-ui/styles.css";
```
For Next.js interactive pages, add `"use client"` before using stateful components or animation. Do not claim support for a non-React target: use a different, target-native design system there.
## Skill installation
The canonical skill source is this directory: `skills/nerv-ui/`. It contains the sole `SKILL.md`; do not create copied variants.
For Codex, install the directory in the local skills folder, then start a new task:Details
- Skill name
nerv-ui- Repository
- mdrbx/nerv-ui
- Path
skills/nerv-ui/SKILL.md- License
- MIT
- Repo updated
- 4 October 2026
- Listed in
- heilcheng/awesome-agent-skills
FAQ
What does the Nerv UI skill do?
Build original, accessible React command-center interfaces with the published @mdrbx/nerv-ui component library. Use for dashboards, monitoring terminals, operational tools, authentication screens, or sharp industrial HUD-style UI in React, Vite, or Next.js.
How do I install the Nerv UI skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add mdrbx/nerv-ui --skill nerv-ui. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Nerv UI popular?
It lives in mdrbx/nerv-ui, which has 96 GitHub stars and 6 forks, and is included in 1 curated skill list.
Related skills
Anti UI Slop
78uizze/uizze
Stop coding agents from shipping generic UI. Use UIZZE's 800,000+ real web and iOS screens to build product-specific interfaces, define a design contract, cover required states, and run a hard finish gate. Use when designing, implementing, redesigning, critiquing, or pre-ship reviewing a web or iOS interface in Codex, Claude Code, Cursor, Copilot, or another coding agent. Trigger with "anti-ui-slop", "stop UI slop", "ground this UI in real screens", or "run the UI finish gate".
Tidyfactor Styler
120TidyFactor/Styler
Production framework styler and surgical RTL UI polish engine with Contextual Decision Layer (CDL). Operates directly inside existing codebases across React/Next.js, PHP, WordPress, and Vanilla HTML/CSS/JS. Trigger on commands 'brief', 'component', 'section', 'page', 'redesign', 'typography', 'palette', 'layout', 'rtl', 'motion', 'styles', or requests for UI polishing and RTL refactoring.
Cinematic UI
90akseolabs-seo/cinematic-ui
Direct a website the way a film is made: cast a director and a film, choose the medium the film calls for (photoreal 3D, hand-drawn, ink wash, print, pixel, neon, type, photography…), cast a lead, ask for the assets, write a shot list for every section, then shoot it with a scroll-driven camera, designed cuts, a grade, and a screening pass on rendered frames. Use for Awwwards / Framer-grade landing pages, brand, product, portfolio and studio sites, immersive or WebGL / 3D sites, scrollytelling, "cinematic", "film style", "director style", "電影感", "導演風格", "分鏡", "像拍電影一樣做網站", a director's colour o
Oil Frontend
139oil-oil/oil-frontend
当任务需要实现、修改、重构或评审产品前端的可见界面、交互行为、前端状态与数据流、组件或样式组织时主动使用，无需用户点名；也用于这些前端行为的测试与验证策略。适用于页面、表单、列表、弹窗、响应式、样式与动效实现和前端代码归属调整。不用于视觉风格、配色、排版与设计方向这类设计判断，也不用于纯后端、构建部署、依赖升级、只修导入路径的机械改动、仅操作现有网站、仅生成设计图片或讨论本 Skill；用户明确要求不使用时不触发。
Frontend Textbooks
108onepixelaway/frontend-textbooks
Create designed US Letter HTML textbooks, manuals, field guides, business books, and coffee-table books from supplied manuscripts, then verify and export matching PDFs. Use for new manuscript-to-book work, existing HTML book enhancement, print/mobile layout repair, manuscript-preserving diagrams or editorial imagery, and final book production.
Design Auditor
92Ashutos1997/claude-design-auditor-skill
Audit designs against 19 rules across Figma files and code (HTML/CSS/React/Vue/Tailwind). Auto-detects framework and design system (MUI, Chakra, shadcn/ui, Ant Design, Radix, Bootstrap). Runs code superpowers across all 19 categories: aria, focus, contrast, tokens, responsive, motion, forms, navigation, spacing, states, microcopy, elevation, iconography/SVG. Flags color blindness risk. Audits dark patterns, ethical design, Nielsen's heuristics. Outputs before/after diffs, developer handoff reports, wireframe-to-spec. English and Korean. Triggers on: check my design, review my UI, audit my layo
Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.