NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
optimized-nextjs-typescript skill Sets opinionated Next.js and TypeScript standards focusing on React Server Components, Zod schemas, and Tailwind CSS styling.
CX Codex +1
1,000installs
vuejs-typescript-best-practices skill Hands your agent a rulebook for Vue.js and TypeScript: Composition API, Pinia, VueUse, Tailwind, plus Vite build tuning. Useful once a Vue codebase outgrows one person's style.
CX Codex +1
1,000installs
figma-code-connect
official skill Creates and updates Code Connect templates that tie Figma components to code snippets. Use it for design-to-code mapping.
CX Codex GP ChatGPT
28installs
motion-designer skill A skill that turns your coding agent into a motion designer: timing specs, easing curves and handoff notes for UI animation.
CX Codex +1
1,600installs
remotion-video-toolkit skill A skill that teaches your AI agent to write Remotion code: animations, timing, MP4 rendering, captions, charts and 3D. Useful when video comes from data instead of a timeline editor.
CX Codex +1
779installs
site-specification skill Turns brief website ideas or brand images into a JSON design specification with layout requirements, target audience, and Google Fonts.
CX Codex +1
2,100installs
ui-design skill Gives the agent a checklist for interfaces: accessibility, responsive layout, performance. Useful when it writes or reviews frontend code.
CX Codex +1
981installs
tailwind-best-practices skill Tailwind CSS v3.4+ and v4 conventions for AI coding agents. It guides responsive mobile-first layouts, dark mode, and migrations to version 4.
CX Codex +1
954installs
shadcn skill A skill with 58 shadcn/ui rules that tells your agent how to add components, build forms and keep accessibility intact.
CX Codex +1
724installs
internationalization-i18n skill This skill gives the agent a rulebook for internationalization: translations, locale-aware dates and numbers, RTL layout. Useful when an app ships in more than one language.
CX Codex +1
978installs
audit-speed skill Traces why a page is slow: LCP, CLS, INP, FCP and TTFB with root-cause trees and a fix list.
CX Codex +1
2,400installs
chrome-extension-ui skill A rule set for Chrome extension interfaces: when to use a popup versus a side panel, how to keep navigation keyboard-accessible, how to handle loading and errors.
CX Codex +1
719installs
image-optimization skill A skill that walks your agent through compressing images and picking modern formats. Useful before a deploy, when pages drag on mobile networks.
CX Codex +1
656installs
guide-swiftui-animations skill A guide skill for SwiftUI motion: implicit and explicit animations, transitions, phase and keyframe animations, the Animatable protocol.
CX Codex +1
347installs
chrome-extension skill A skill with 67 rules for Chrome Extensions on Manifest V3. Useful when you write a service worker, a content script, or migrate off MV2.
CX Codex +1
717installs
brand-designer skill Walks you through building a brand identity: logo concepts, color palette, typography and guidelines. Useful when the visual system has to live in your codebase.
CX Codex +1
1,300installs
tanstack-ai skill Guides agents on TanStack AI patterns for text streaming, tool calling, and typed output in React or Solid.
CX Codex +1
1,600installs
tanstack-db skill This skill guides agents through TanStack DB collections, live queries, and optimistic mutations for client-side application data.
CX Codex +1
1,600installs
typography-expert skill Curates typeface pairings, fluid clamp scales, and variable font axes while retiring overused defaults like Inter, Roboto, and Montserrat.
CX Codex +1
413installs
webflow-mcp:site-activity skill Inspects Webflow Enterprise activity logs to identify who made changes across pages, styles, and CMS before you publish.
CX Codex +1
757installs
zustand-state-management skill Enforces Zustand store best practices in React and TypeScript apps, covering store slices, SSR, and testing. It helps eliminate selector re-renders and hydration bugs.
CX Codex +1
959installs
typescript skill Enforces strict TypeScript standards and functional code patterns in your AI assistant. It bans any, replaces enums with maps, and caps function length at 20 lines.
CX Codex +1
955installs
hyva-cms-component skill Walks you through building a custom Hyvä CMS component for Magento 2: module, fields, PHTML template and setup:upgrade.
CX Codex +1
762installs
svelte-components skill Tells your agent how to build Svelte components: headless libraries, custom elements, and forms that cannot wrap their inputs.
CX Codex +1
531installs
pixi-js skill A skill that steers your coding agent toward performant Pixi.js games in TypeScript, with mobile and rendering advice baked in.
CX Codex +1
948installs
layout-paradigms-and-consistency skill Selects screen paradigms like feeds, boards, tables, and split views to maintain layout consistency across app pages and marketing funnels.
CX Codex +1
734installs
react skill This skill gives your agent a fixed React style: hooks, Server Components, Tailwind, TypeScript. Useful when several people or agents touch the same codebase.
CX Codex +1
944installs
hyva-cms-custom-field skill Generates custom inputs and modal handlers for Hyvä CMS components. Helps Magento developers extend editor controls without writing boilerplate by hand.
CX Codex +1
752installs
flutter-navigation skill A skill that makes your coding agent handle Flutter navigation: Navigator, go_router, deep links, redirects and browser history.
CX Codex +1
589installs
internationalization-i18n skill A skill that walks your agent through shipping a multi-language app: string extraction, translation catalogs, plurals, locale-aware dates and numbers, RTL.
CX Codex +1
633installs
antdv-next skill The skill gives your agent a local copy of the Antdv Next docs: component APIs, demos, theme tokens. Useful when you edit a Vue 3 UI and don't want the model browsing the site.
CX Codex +1
1,400installs
react-nextjs-patterns skill App Router conventions for React and Next.js projects. Guides component architecture, cache boundaries, and Server Actions security.
CX Codex +1
1,100installs
dd-browser-sdk skill Routes coding agents through Datadog Browser SDK upgrades from v4 to v7 and automates sourcemap uploads across major bundlers.
CX Codex +1
577installs
hyva-cms-components-dump skill Dumps every Hyvä CMS component available in a Magento 2 project, merged across the modules that are switched on.
CX Codex +1
744installs
data-visualization
official skill This skill routes web visualization tasks, from chart selection to maps, software diagrams, and exports. Use it when an agent needs to plan or review a data visualization.
CX Codex GP ChatGPT
26installs
cloud-storage-web skill Lets the agent upload and manage CloudBase storage files from browser code with @cloudbase/js-sdk, including temporary download links.
CX Codex +1
1,000installs
flutter skill Enforces Flutter and Dart standards: feature-first clean architecture, state management with Riverpod or BLoC, and strict limits on widget tree depth.
CX Codex +1
925installs
threejs-3d-graphics skill Configures the agent as a senior Three.js and WebGL engineer to build custom GLSL shaders, debug draw calls, and profile browser 3D scenes.
CX Codex +1
457installs
color-accessibility skill Guides accessible palette design under WCAG AA and AAA standards, including support for color blindness. Helps style interfaces, charts, and form states.
CX Codex +1
619installs
deno-frontend skill Guides frontend development on Deno. Helps run npm frameworks like Vite or Next.js and build island-based apps with Fresh 2.x.
CX Codex +1
408installs
1,921–1,960 of 2,909
