NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
ui-web skill Design skill enforcing WCAG 2.1 AA accessibility, Tailwind CSS tokens, dark mode contrast, and glassmorphic UI patterns.
CX Codex +1
393installs
wcag-accessibility-audit skill Checks websites and web apps against WCAG 2.1 and 2.2, exposing accessibility barriers and reviewing A, AA, or AAA conformance.
CX Codex +1
1,600installs
industrial-brutalist skill A skill for sites in industrial brutalism and tactical telemetry style. It generates design images first, then writes the frontend.
CX Codex +1
311installs
web-game-foundations
official skill Defines browser game architecture before coding begins. Helps choose an engine and decouple simulation from rendering.
CX Codex GP ChatGPT
52installs
view-refactor
official skill This skill restructures macOS SwiftUI views and scenes. Use it when a large view needs splitting or AppKit boundaries have grown too broad.
CX Codex GP ChatGPT
52installs
network-request-auditing skill Audits browser fetch and XHR calls after UI interactions to find errors, duplicate requests, and latency issues. Useful for API-heavy pages and backend changes.
CX Codex +1
435installs
dark-mode-testing skill Toggles light and dark mode in the browser, screenshots both states, and points out hardcoded colors, invisible text and contrast failures.
CX Codex +1
436installs
mapbox-search-integration skill Walks your agent through the full Mapbox search rollout: discovery questions first, then a working integration with the right API and parameters.
CX Codex +1
1,900installs
mapbox-token-security skill Security guidelines for Mapbox access tokens: scope management, URL restrictions, and client initialization guards.
CX Codex +1
1,900installs
upgrade-react-native skill Upgrades React Native Community CLI projects to a target version using diffs from the React Native Upgrade Helper.
CX Codex +1
1,300installs
vite skill A Vite 6.x skill that walks your agent through config files, plugin setup, the dev server and production builds.
CX Codex +1
747installs
nextjs-app-architecture skill A skill that keeps a Next.js 16 App Router codebase on one architecture: pages compose, features fetch. Useful when starting an app or auditing one.
CX Codex +1
485installs
svelte-runes skill Guides coding agents on Svelte 5 runes without mixing legacy syntax. It helps set up reactive state, derived values, effects, and component props.
CX Codex +1
1,000installs
sveltekit-structure skill Tells the agent how to lay out routes, nested layouts and error boundaries in SvelteKit. Useful once a project grows and files start to blur.
CX Codex +1
1,000installs
quieter skill An AI-coding skill that lowers visual noise in an interface: less motion, simpler layout, calmer color. Useful when a UI feels loud or over-designed.
CX Codex +1
451installs
writing-for-interfaces skill Guides UI text drafting, error message rewrites, and button labels to keep interface copy aligned with product voice.
CX Codex +1
1,100installs
finding-dev-server-url skill Scans running terminal sessions for dev server URLs and localhost ports. Useful when you need to locate active local endpoints or check port collisions.
CX Codex +1
425installs
bolder skill A skill that gives an interface more character: wider layout variance, more motion, one signature detail. Useful when the UI works but reads flat.
CX Codex +1
445installs
shader-glsl skill GLSL fragment shader skill for generating animated backgrounds, image transitions, and Three.js ShaderMaterial pipelines.
CX Codex +1
1,400installs
converting-css-to-tailwind skill This skill walks a plain CSS file and rewrites its rules as Tailwind utility classes in your markup. Handy when a project moves off hand-written CSS.
CX Codex +1
423installs
now-reading-page skill Turns your Readwise Reader library into a single HTML page showing what you are reading now and what you finished recently.
CX Codex +1
455installs
visual-testing skill A skill for visual regression testing: it compares screenshots against approved baselines and flags pixel-level differences that functional tests miss.
CX Codex +1
1,200installs
render-props-pattern skill A skill that walks through the render props pattern in React and tells you when a hook is the better call. Useful when rendering logic has to be shared across components.
CX Codex +1
1,000installs
client-side-rendering skill A skill that walks through client-side rendering in React: when CSR fits, and when your page loses on SEO and first paint.
CX Codex +1
1,000installs
hoc-pattern skill Teaches your AI assistant the Higher-Order Component pattern to share logic across React components. Useful for reusable auth, logging, or data fetching.
CX Codex +1
1,000installs
compound-pattern skill Teaches the agent the compound component pattern for shared implicit state. Useful for tabs, accordions and dropdowns whose parts must coordinate without explicit props.
CX Codex +1
1,000installs
nextjs
official skill Guidance for building and debugging Next.js App Router projects. Use it to work through routing, Server Components, data fetching, and rendering choices.
CX Codex GP ChatGPT
50installs
detecting-port-conflicts skill Detects EADDRINUSE and port conflicts in terminal output, identifies blocking processes with lsof, and kills them or picks an open port for your dev server.
CX Codex +1
418installs
swiftui-animation skill Guides AI coding agents through building SwiftUI spring animations and Metal shader effects on iOS and macOS.
CX Codex +1
567installs
godot-ui-rich-text skill A skill for RichTextLabel work in Godot: BBCode markup, clickable links, custom shader effects and dialogue systems.
CX Codex +1
400installs
iphone-duo-readiness skill Audits iOS apps and prepares them for the foldable iPhone Duo. It hunts hardcoded screen sizes, deprecated UIScreen calls, and layout bugs when targeting the iOS 27.1 SDK.
CX Codex +1
630installs
write-landing skill Writes landing page copy and wireframe structure for conversion and SEO. Useful when you need a full page, not just a headline.
CX Codex +1
468installs
phaser-2d-game
official skill Build 2D browser games with Phaser, TypeScript, and Vite. The skill covers scenes, gameplay systems, cameras, sprite animation, and DOM-based HUD patterns.
CX Codex GP ChatGPT
49installs
profiling-performance skill This skill profiles web application CPU performance using browser MCP tools. It captures call stacks and pinpoints slow functions causing interface lag.
CX Codex +1
410installs
ui-testing skill An accessibility and visual QA checklist for components: detects invisible buttons, failing contrast ratios, and small touch targets.
CX Codex +1
364installs
threejs-perf skill Three.js optimization patterns that batch draw calls and accelerate updates for thousands of moving objects.
CX Codex +1
639installs
vue skill Guides agent code generation for Vue components and reactivity patterns. Helpful when writing composables or using script setup.
CX Codex +1
706installs
htmx skill Development guidelines for HTMX: the agent writes markup with hx attributes and returns only the HTML fragments the page needs.
CX Codex +1
1,700installs
scss-best-practices skill Enforces SCSS best practices including the 7-1 folder structure, BEM naming, and a strict three-level nesting limit. Useful when styling maintainable frontend projects.
CX Codex +1
1,700installs
browser-preview skill Walks the agent through a broken Preview tab: service registry, ports, and static asset paths that 404 behind the proxy.
CX Codex +1
4,600installs
1,641–1,680 of 2,909
