NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
graphql skill Reference skill for GraphQL: guides your coding agent through SDL schema design, Apollo Server resolvers, and Apollo Client queries.
CX Codex +1
331installs
docs-lookup skill Finds answers in official Astro docs for version-sensitive configs, adapters, and content collections.
CX Codex +1
418installs
flexlayout-react skill A skill that walks your coding agent through flexlayout-react: draggable panels, tabs, splitters and saved layouts for React apps.
CX Codex +1
328installs
cpq-builder skill Turns DOMAIN.md specs into working Configure-Price-Quote prototypes for the Customware SPA, replacing fragile spreadsheets and email quote threads.
CX Codex +1
1,200installs
content-collection skill This skill guides Astro content collections with typed schemas and query patterns. Use it for blogs, docs, changelogs, and other structured content.
CX Codex +1
410installs
astrale-cli skill A practical reference for Astrale CLI: graph access, Kernel calls, domains, identities, journals, views, and local UI project commands.
CX Codex +1
1,800installs
sasjs-adapter skill Configures TypeScript and JavaScript calls to SAS backends via @sasjs/adapter. Useful when preparing table payloads and handling SAS9 or SAS Viya responses.
CX Codex +1
1,000installs
validated-handler skill Adds a type-safe route handler pattern for Next.js App Router using Zod validation. It cuts repetitive parsing and keeps API errors consistent.
CX Codex +1
322installs
react-grab skill This skill lets an agent pull context for a React element you pick in a live browser: component name, file, line and HTML. Useful when a fix has to match the real DOM.
CX Codex +1
344installs
nextjs-best-practices skill App Router architecture principles for Claude Code. Guides the agent to keep components server-side, configure caching, and organize folder layouts.
1,785installs
add-integration skill This skill adds and configures Astro integrations, adapters, and UI framework tooling. Use it when a project needs React, Tailwind, MDX, or server output.
CX Codex +1
399installs
car-sales-data-engineering-analytics skill This skill cleans car sales data, runs statistical analysis, and serves an interactive Streamlit dashboard. Use it to inspect prices, regions, and vehicle attributes.
CX Codex +1
1,200installs
brand-motion-guidelines skill Produces a fill-in-ready motion guidelines document: principles, duration and easing tokens, a pattern library, logo rules. Useful when animation across a team drifts apart.
CX Codex +1
572installs
trades-builder skill Turns a DOMAIN.md spec into a field operations tool for Customware SPA. Generates scope-based estimates, crew schedules, and progress tracking tables.
CX Codex +1
1,100installs
cloudinary-next skill Guides your agent through Next.js code that uses Cloudinary: images, video, uploads, OG cards. Handy when the server/client boundary or signed uploads get messy.
CX Codex +1
307installs
next-upgrade
official skill Walks a project through major Next.js upgrades: reads the current version, pulls the official guides and runs codemods.
CX Codex GP ChatGPT
3installs
remotion-studio
official skill Starts Remotion Studio and prints a browser URL for video preview. Use it while checking a Remotion project.
CX Codex GP ChatGPT
3installs
remotion-saas
official skill Guides you through building a Remotion app, from a simple form that triggers a render to a full video editor. Useful for SaaS products that output video.
CX Codex GP ChatGPT
3installs
remotion-multimedia
official skill This skill guides Mediabunny tasks in the browser, including reading audio and video duration and checking video dimensions.
CX Codex GP ChatGPT
3installs
remotion-maps
official skill Guides map animation techniques in Remotion, covering everything from static satellite shots to 3D terrain flythroughs.
CX Codex GP ChatGPT
3installs
remotion-create
official skill Scaffolds Remotion video projects in Codex, sets up React compositions, and launches live preview via Remotion Studio.
CX Codex GP ChatGPT
3installs
gsap
official skill A GSAP cheat sheet for your agent: tweens, timelines, easing, performance. Useful when writing animation inside HyperFrames compositions.
CX Codex GP ChatGPT
3installs
migrate skill Plans and runs a move to Astro or an Astro version upgrade. Useful when an existing app has to be taken apart piece by piece instead of rewritten blind.
CX Codex +1
363installs
safe-action-validation-errors skill Guides coding assistants on handling input and manual validation errors in next-safe-action. Useful when writing server actions and UI error displays.
CX Codex +1
1,200installs
safe-action-hooks skill A skill that tells your agent which next-safe-action hook fits a form or optimistic UI, and how to wire it to the server action.
CX Codex +1
1,200installs
safe-action-client skill Guides agents in configuring next-safe-action clients and defining type-safe Next.js server actions with input schemas and structured error returns.
CX Codex +1
1,200installs
safe-action-forms skill This skill guides next-safe-action form integrations, from native HTML submission to React Hook Form, optimistic updates, and file uploads.
CX Codex +1
1,200installs
next-intl-app-router skill Sets up next-intl with locale-prefixed routes: config, proxy, navigation and message files. Useful when a project gets a second language.
CX Codex +1
601installs
21st-dev-builder-v2 skill A skill that walks the agent through the 21st.dev registry: it finds components, picks the fitting ones and assembles pages and apps in React and Tailwind.
CX Codex +1
468installs
yjs-best-practices skill A skill that steers your agent through Yjs pitfalls: duplicate imports, subdocuments, YKeyValue and V2 encoding.
CX Codex +1
303installs
add-icon skill Finds and inserts Font Awesome icons into your codebase according to your active framework and setup.
CX Codex +1
569installs
safe-action-testing skill Tells the agent how to write Vitest tests for next-safe-action actions and hooks: validation, middleware, server errors.
CX Codex +1
1,100installs
suggest-icon skill Picks a Font Awesome icon for a concept, situation or verb, then checks it exists in your version or Kit.
CX Codex +1
551installs
setup-fa skill Configures Font Awesome from scratch: detects your framework, sets up a Kit or packages, and creates .font-awesome.md for icon workflows.
CX Codex +1
503installs
fa-help skill Answers Font Awesome questions from the official documentation instead of model memory. Handy for setup, styling and upgrade work.
CX Codex +1
498installs
screenshot skill This skill renders local pages in Chromium and saves full-page desktop and mobile captures. Use it to inspect a landing page, report, or local dev server.
CX Codex +1
337installs
microfrontends
official skill Splits a large app into independently deployable units that still render as one site. Handy when several teams own parts of the frontend.
CX Codex GP ChatGPT
2installs
shopify-pos-ui
official skill Generates Preact components and extensions for Shopify retail point-of-sale systems. Helps developers scaffold modules through the CLI and validate code against UI targets.
CX Codex GP ChatGPT
2installs
hyperframes-registry
official skill Helps install and wire registry blocks and components into HyperFrames video compositions.
CX Codex GP ChatGPT
2installs
hyperframes-cli
official skill This skill runs HyperFrames projects from setup to video output, with checks for composition layout, browser preview, transcription, and speech generation.
CX Codex GP ChatGPT
2installs
2,721–2,760 of 2,909
