Total 52,033 skills, Frontend Development has 4963 skills
Showing 12 of 4963 skills
Brand-first landing page designer — interviews the user to discover brand identity (adjectives, colors, typography, shape language), then generates and iterates on a polished landing page via Stitch with deployment-ready HTML output. Preferred over frontend-design for standalone landing/marketing pages where the user hasn't established visual direction yet. TRIGGER when: user asks to "create/design/build a landing page", "make a homepage for my project/product/service", "build a marketing page", or wants to promote an app/side project. Especially when they haven't defined brand colors, fonts, or visual style — the guided brand interview is the core value. DO NOT TRIGGER when: user has a specific design mockup to implement, wants a dashboard or app UI, needs component-level frontend work (buttons, forms, navbars), is building a multi-page application, or is restyling an existing page with known design tokens. Use frontend-design for those cases.
Build, edit, and deploy full-stack websites via the Higgsfield CLI (`higgsfield website …`). Each site is a React 19 + TanStack Start app, server-rendered as one Cloudflare Worker, with D1 / R2 / KV / Durable Objects / Containers. The loop: create → repo-access → clone → edit → push → deploy preview. This skill is the website template's AGENTS.md — stack, the wow-maker design contract, the hard rules, the editing map, and the verify/deploy flow, plus per-task references. Everything is here; don't search the skill library for other design guidance. Use when: "build me a website", "make a landing page", "create a web app", "build a SaaS dashboard / tool / portfolio", "deploy this site", "edit or add a page or feature to my site", "ship to production". Chain with: higgsfield-generate for hero images, video loops, and OG assets. NOT for: single image/video/audio generation (higgsfield-generate), product photos (higgsfield-product-photoshoot), marketplace cards (higgsfield-marketplace-cards).
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.
Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
Vite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building libraries/SSR apps with Vite.
Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel, watchers, or using Transition/Teleport/Suspense/KeepAlive.
Creating a new Remotion video
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
Upgrade Next.js to the latest version following official migration guides and codemods
Render videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video
Complete shadcn/ui component library guide including installation, configuration, and implementation of accessible React components. Use when setting up shadcn/ui, installing components, building forms with React Hook Form and Zod, customizing themes with Tailwind CSS, or implementing UI patterns like buttons, dialogs, dropdowns, tables, and complex form layouts.
Implement web accessibility (a11y) standards following WCAG 2.1 guidelines. Use when building accessible UIs, fixing accessibility issues, or ensuring compliance with disability standards. Handles ARIA attributes, keyboard navigation, screen readers, semantic HTML, and accessibility testing.