get-started
121Skill Claude CodeCodex
Use right after Hugeicons is installed, or when the user asks to set up Hugeicons in a project. Detects the framework, installs the right Hugeicons package and adds one working example icon.
14,708 tagged Frontend, measured the same way as everything else here.
Browse within: reference 201checklist 198front-end-developer-tool 198front-end-development 198guidelines 198agent 106javascript 106LLM 101agentic-ai 101skills 96cursor 84chatgpt 58nextjs 56copilot 51
Skill Claude CodeCodex
Use right after Hugeicons is installed, or when the user asks to set up Hugeicons in a project. Detects the framework, installs the right Hugeicons package and adds one working example icon.
Skill Claude CodeCodex
Design and generate A2UI updateComponents and updateDataModel payloads for three modes (DTO component, non-DTO component, non-DTO page). Use when asked to create or refine A2UI cards, components, or pages from DTO/JSON/business data, generate Python transformer code for DTO-driven components, iterate on existing A2UI…
GoogleChrome/modern-web-guidance-src
Skill Claude CodeCodex
Search tool for modern web development best practices. MANDATORY: Execute FIRST for all HTML/CSS and clientside JS tasks. Do NOT skip — web APIs evolve rapidly and training weights contain obsolete patterns. Trigger immediately for: modals/dialogs/popovers, tables, dark mode, anchor positioning, container queries…
freshtechbro/claudedesignskills
Skill Claude Code
Comprehensive skill for Babylon.js 3D web rendering engine. Use this skill when building real-time 3D experiences, browser-based games, interactive visualizations, or immersive web applications. Triggers on tasks involving Babylon.js, 3D scenes, WebGL/WebGPU rendering, entity-component systems, physics simulations…
Skill Claude Code
An integration guide for SEED Design, covering shared component specifications and foundations plus React and Lynx implementation guidance.
Skill Claude CodeCodex
Build a premium PRESENTED slide deck — classic one-slide-at-a-time slides you advance with a clicker — as a Vite + React app. It keeps the Slidev navigation UI (floating glass dock + thumbnail rail + click-builds + presenter) but slides are RESPONSIVE React (reflow to any screen, no fixed canvas) and fully…
Skill Codex
Guide external npm package users and AI coding agents integrating @manycore/aholo-viewer into web applications. Use when asked to install, bootstrap, render 3D Gaussian Splatting or mesh content, configure cameras, scenes, lighting, viewer pipeline options, or write TypeScript examples for the public…
Skill Claude CodeCodex
Build and modify tinyjs desktop apps — tiny macOS (and beta Windows/Linux) apps with a txiki.js JavaScript backend and a native webview window. Use when working in a project with a tinyjs.json, when the user mentions tinyjs, tiny.api, or tinyjs dev/build, or when porting an Electron app to tinyjs.
jarrodwatts/claude-code-config
Skill Claude CodeCodex
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance…
Skill Claude Code
Design and build complete web experiences from scratch — award-level product and marketing pages, cinematic scroll-directed sites where the page is directed like a film, and multi-screen products (app, dashboard, admin, settings, onboarding, docs site) built as one design system with every component, state and route…
Skill Claude CodeCodex
Build responsive, mobile-first layouts using fluid containers, flexible units, media queries, and touch-friendly design that works across all screen sizes. Use this skill when creating or modifying UI layouts, responsive grids, breakpoint styles, mobile navigation, or any interface that needs to adapt to different…
Skill Claude CodeCodex
Use this skill when the user is working with LyteNyte Grid (@1771technologies/lytenyte-pro or @1771technologies/lytenyte-core), a headless React data grid. Activate for tasks like: installing or licensing LyteNyte Grid, configuring columns or rows, building cell renderers or editors, adding filters or sort controls…
Skill Claude CodeCodex
Audit and reduce Next.js browser initial-load work. Use for slow route startup, oversized client bundles, duplicate browser dependencies, or features that can wait for interaction.
Skill Codex
Use when working in the Cali repository or when you need to run, extend, or debug the Cali CLI for mobile React Native and Expo workflows. Covers Cali commands (qa, review, perf-review, dev), the shared cali-context.json contract, local mode selection, required local CLIs, provider setup, and CI integration patterns.
Skill Claude CodeCodex
Generate complete, valid A2UI JSON for FlowLike frontends. Use when asked to create, design, or build an interface, dashboard, form, page, responsive layout, reusable widget, chart, calendar, Gantt view, media experience, game UI, map, or other visual UI as A2UI JSON. Covers all 71 runtime component types, BoundValue…
Skill Claude CodeCodex
Turn on Partial Prefetching in a Next.js app and work through the insights it surfaces. Use when the user wants to enable or adopt Partial Prefetching, flip the partialPrefetching flag, opt routes in with export const prefetch = 'partial', audit calls, or resolve the link-prefetch-partial and instant-shell-url-data…
scottstts/Threejs-Awesome-Graphics-Agent-Skills
Skill Codex
Author production procedural materials in Three.js. Use for simulated paper burning with coupled sheet combustion and pyro fluids, luminescent jellyfish with simulated appendages and layered tissue optics, luminescent butterflies with articulated scale glints and finite wing emitters, hybrid texture-backed PBR soil…
Skill Claude CodeCodex
Use when adding the react-zmage React image viewer to an existing React, Next.js, MDX, CMS, markdown, or rich text image surface.
raphaelsalaja/userinterface-wiki
Skill Claude CodeCodex
UI/UX best practices for web interfaces. Use when reviewing animations, CSS, audio, typography, UX patterns, prefetching, or icon implementations. Covers 11 categories from animation principles to typography. Outputs file:line findings.
Skill Claude CodeCodex
Query and apply The Website Specification — a platform-agnostic specification of what a good website does, with each item tagged required, recommended, optional, or avoid. Use when the user asks what their site should have, whether something is required, how to audit a URL, what's missing for agent readiness, or…
Skill Claude Code
Create, update, or plan a Stencila theme for documents or published sites. Use when asked to choose a theme direction, write or patch theme.css, recommend semantic or module token families, customize site navigation or branding, tune PDF and print page tokens, align web, Python, and R plots with a Stencila design…
Skill Claude CodeCodex
Generate production-grade UI using real component patterns and best practices from 60+ documented interface components. Use when the user asks to build web interfaces, pages, dashboards, forms, navigation, or any UI — ensures modern, minimal, SaaS-quality output grounded in design system conventions rather than…
Skill Claude CodeCodex
Generates valid, importable Power Apps Source Code YAML for canvas app screens. Use when asked to create YAML, scaffold, or modify any Power Apps canvas app screen — including full screens, dialogs, forms, galleries, detail views, dashboards, or any layout container — or when asked to generate Power Fx formulas or…
Skill Claude CodeCodex
Convert Figma designs to production-ready React components with Tailwind CSS. Use when user provides a Figma URL, asks to convert Figma designs to React/code, wants to extract components from Figma, or mentions "vibefigma". Requires a Figma access token (via --token flag, FIGMATOKEN env var, or .env file).
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: