NeVibeCode · 2,909 items
Skills for Frontend and UI
Skills for Frontend and UI: what each one does, an install command and example prompts.
clerk-tanstack-patterns skill Walks your agent through Clerk auth in TanStack React Start: route guards, createServerFn, loaders and request middleware.
CX Codex +1
15,500installs
compose-focus-navigation skill This skill guides focus navigation in Jetpack Compose for TV, keyboards, desktop, accessibility, and D-pad input. It helps with initial and restored focus.
CX Codex +1
1,900installs
experience-ui-bundle-agentforce-client-generate skill Embeds the Agentforce Conversation Client in React and Angular UI Bundle apps: detects the framework, validates agentId, wires the component into a page.
CX Codex +1
5,000installs
experience-ui-bundle-site-generate skill Generates Salesforce Digital Experience Site infrastructure for hosting React UI bundles. Useful when setting up thin site containers, guest access, and locale configs.
CX Codex +1
5,000installs
pixijs-scene-gif skill Teaches coding assistants how to load and play animated GIFs in PixiJS v8 with GifSprite. Useful when embedding GIF assets directly into scene trees.
CX Codex +1
5,600installs
tailwind-theme-builder skill This skill sets up a Tailwind v4 + shadcn/ui theme with dark mode: installs deps, maps CSS variables through @theme inline, wires a theme toggle.
CX Codex +1
3,200installs
color-palette skill Turns a single brand hex into a full colour system: an 11-shade scale, semantic tokens, dark mode variants and WCAG contrast checks.
CX Codex +1
3,200installs
critique-information-density skill A skill that critiques a rendered screen's density: cognitive load, content priority, scanning patterns and progressive disclosure. Useful when a screen feels overwhelming.
CX Codex +1
1,700installs
doherty-threshold skill This skill sets response-time targets for interface interactions and suggests feedback patterns when a wait cannot be avoided.
CX Codex +1
1,700installs
millers-law skill Chunks interface elements into groups of about four to fit working memory limits. Useful when structuring navigation menus, onboarding flows, and form sections.
CX Codex +1
1,700installs
von-restorff-effect skill This skill guides coding agents to isolate a single primary action on a screen using visual contrast. It applies when one choice must grab attention immediately.
CX Codex +1
1,700installs
hicks-law skill A skill that applies Hick's Law — decision time grows with the number of simultaneous choices. Useful when a screen throws too many options at the user.
CX Codex +1
1,700installs
fitts-law skill A skill that makes your coding agent size and position controls by Fitts's Law. Useful when building touch interfaces or auditing mis-taps.
CX Codex +1
1,700installs
readable-measure skill Sets optimal typographic measure and line length across screen breakpoints. Helps maintain reading comfort in body copy, articles, and UI descriptions.
CX Codex +1
1,700installs
localization-design skill Helps design UI for different languages, writing directions, and cultural contexts before translations arrive.
CX Codex +1
1,700installs
law-of-common-region skill A Gestalt skill that tells your agent when to group elements with a container, background or border instead of spacing alone.
CX Codex +1
1,700installs
law-of-proximity skill Applies the Law of Proximity to UI layouts, using spacing to show which elements belong together. Use it when grouping must work without borders or labels.
CX Codex +1
1,800installs
search-ux skill Guides the agent through search design: query input, suggestions, filters, results and the empty state. Useful when people retrieve instead of browse.
CX Codex +1
1,800installs
onboarding-design skill Designs the first-run experience and activation path. It shortens time to first value by optimizing empty states and setup flows.
CX Codex +1
1,800installs
pixijs-accessibility skill Configures screen readers and keyboard navigation in PixiJS v8 apps by rendering a shadow DOM overlay.
CX Codex +1
5,500installs
claude-design skill A skill that produces design artifacts in HTML: landing pages, decks, prototypes, posters and wireframes. Useful when you need quick layout options.
CX Codex +1
2,200installs
perf-lighthouse skill Runs local Lighthouse audits via CLI or Node API, parses reports, and configures performance budgets. Useful for tracking Core Web Vitals and integrating speed checks into CI.
CX Codex +1
321installs
i18n-expert skill Sets up and audits UI localization by replacing visible strings with keys and checking locale parity. Use it for React, Next.js, or Vue codebases.
CX Codex +1
2,700installs
swiftui-webkit skill Guides coding agents on native SwiftUI WebKit APIs for iOS 26+. Covers WebView, WebPage observation, custom navigation policies, and JavaScript calls.
CX Codex +1
3,200installs
jury skill Screenshots every page type, measures LCP, CLS, FPS and accessibility, then a blind critic scores the site and ranks fixes.
CX Codex +1
911installs
omnistudio-flexcard-generate skill Generates and validates Salesforce OmniStudio FlexCards with a 130-point scoring rubric. Connects UI components to Integration Procedures with SLDS styling.
CX Codex +1
4,800installs
omnistudio-omniscript-generate skill This skill builds and validates OmniScripts for guided, multi-step processes using Integration Procedures and Data Mappers. Use it for forms with branching logic and data flow.
CX Codex +1
4,800installs
compose-animations skill Helps write and review Jetpack Compose motion across common UI states. Useful when picking between AnimatedVisibility, AnimatedContent, animate*AsState, and rememberTransition.
CX Codex +1
1,800installs
clerk-swift skill Builds Clerk sign-in UI in native iOS and macOS apps: prebuilt ClerkKitUI views or custom ClerkKit flows.
CX Codex +1
14,500installs
browser-tools skill This skill connects an agent to Chrome through the Chrome DevTools Protocol for page interaction, frontend checks, and JavaScript-driven sites.
CX Codex +1
465installs
pixijs-migration-v8 skill This skill guides a PixiJS v7 to v8 migration and diagnoses common post-upgrade breakage. Use it when old APIs or imports need replacing.
CX Codex +1
5,300installs
clerk-chrome-extension-patterns skill Guides integration of @clerk/chrome-extension into Chrome extensions. Helps configure popup sign-in, service worker session tokens, and OAuth delegation via syncHost.
CX Codex +1
14,400installs
mobile-platform-offline-validate skill Audits Lightning Web Components for Komaci offline priming compatibility in Salesforce mobile apps and generates code-level fixes.
CX Codex +1
4,700installs
mobile-platform-native-capabilities-integrate skill Guides an agent through building Salesforce LWCs that use native mobile features such as scanning, location, NFC, and payments. Use it for lightning/mobileCapabilities work.
CX Codex +1
4,700installs
pencilkit skill Guides Apple Pencil drawing setup via PencilKit in Swift, configuring tool pickers and serializing strokes. Helpful when building signature pads or drawing screens on iOS.
CX Codex +1
3,100installs
clerk-astro-patterns skill Walks your agent through Clerk inside Astro: middleware, protected SSR pages, API route auth and island components.
CX Codex +1
14,300installs
prototype-prompt-generator skill Turns UI requirements into detailed, structured prompts for building HTML, CSS, or React prototypes.
CX Codex +1
393installs
critique-color skill The skill reviews colour choices on a single rendered screen, auditing contrast ratios, token consistency, and semantic colour meaning for accessible UI.
CX Codex +1
1,600installs
add-read-aloud skill Builds Grok text-to-speech into an existing app, for read-aloud controls, automatic playback, or spoken page content.
CX Codex +1
320installs
add-voice skill Adds two-way Grok voice conversations to an app. Use it when replacing an STT-LLM-TTS chain or an OpenAI Realtime integration.
CX Codex +1
319installs
1,041–1,080 of 2,909