Skip to content

Claude Code Frontend plugins and skills

Flowy lists 15 plugins in the Frontend category for Claude Code. UI components, client-side frameworks, styling, browser behaviour Every listing shows what is inside before you install, who built it, and whether it is Auto-invoked, meaning a FLOW.md router fires the right skill as you prompt instead of leaving them dormant.

ui
Plugin
Frontend

ui

A set of beautifully designed components that you can customize, extend, and build on. Start here then make it your own. Open Source. Open Code. Use this to build your own component library.

2 skills
@shadcn-ui@shadcn-uiView Plugin
daisyui
Plugin
Frontend

daisyui

🌼 🌼 🌼 🌼 🌼  The most popular, free and open-source Tailwind CSS component library

5 skills
@saadeghi@saadeghiView Plugin
chakra-ui
Plugin
Frontend

chakra-ui

Chakra UI is a component system for building SaaS products with speed ⚡️

3 skills
@chakra-ui@chakra-uiView Plugin
shadcn-vue
Plugin
Frontend

shadcn-vue

A set of beautifully designed components that you can customize, extend, and build on. Start here then make it your own. Open Source. Open Code. Use this to build your own component library.

1 skill
@unovue@unovueView Plugin
shadcn-svelte
Plugin
Frontend

shadcn-svelte

shadcn/ui, but for Svelte. ✨

1 skill
@huntabyte@huntabyteView Plugin
stitch-skills
Plugin
Frontend

stitch-skills

A collection of agent skills and plugins for Google Stitch, following the Agent Skills open standard. Compatible with coding agents such as Codex, Antigravity, Gemini CLI, Claude Code, Cursor, and OpenCode (manual install).

15 skills
@google-labs-code@google-labs-codeView Plugin
react-joyride
Plugin
Frontend

react-joyride

Create guided tours in your apps

1 skill
@gilbarbara@gilbarbaraView Plugin
ui
Plugin
Frontend

ui

![npm version][npm-version-href] ![npm downloads][npm-downloads-href] ![License][license-href] ![Nuxt][nuxt-href] Nuxt UI harnesses the combined strengths of Reka UI, Tailwind CSS, and Tailwind Variants to offer developers an unparalleled set of tools for

1 skill
@nuxt@nuxtView Plugin
preline
Plugin
Frontend

preline

Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.

1 skill
@htmlstreamofficial@htmlstreamofficialView Plugin
ai-elements
Plugin
Frontend

ai-elements

AI Elements is a component library built on top of shadcn/ui to help you build AI-native applications faster.

1 skill
@vercel@vercelView Plugin
ai-friendly-web-design-skill
Plugin
Frontend

ai-friendly-web-design

A skill for coding agents that build, review, and refactor Web UI that should be easier for humans, screen readers, browser automation, Playwright tests, and AI agents to understand and operate. Inspired by: @karminski-牙医 · Compiled by: @ianho7

1 skill
@ianho7@ianho7View Plugin
ak-elementor-studio
Plugin
Frontend

ak-elementor-studio

A Claude AI skill that converts any design into production-ready WordPress Elementor templates

1 skill
@abanoubkhaliil@abanoubkhaliilView Plugin
swiftui-autotest-skill
Plugin
Frontend

swiftui-autotest-skill

Open-source Agent Skills for automated visual testing and accessibility setup of iOS/SwiftUI applications using Claude Code's computer use.

2 skills
@yusufkaran@yusufkaranView Plugin
design-with-claude
Plugin
Frontend

design-with-claude

dwic (design with claude) puts a senior designer inside Claude Code. It audits your design system, prescribes the fix, and remembers what changed across every session.

@imsaif@imsaifView Plugin
figma-design-skills
Plugin
Frontend

figma-design-skills

Two composable, tool-agnostic skills for design-to-code fidelity — get the real design out of Figma, then prove the running app actually matches it.

2 skills
@jeltehomminga@jeltehommingaView Plugin

FAQ

What are the best Claude Code Frontend plugins?
Flowy lists 15 plugins for Frontend, ranked by fit and signal rather than raw install count. Open any listing to read every skill in full before you install it.
Do these Frontend skills run automatically?
The Auto-invoked ones do. They ship a FLOW.md router and a hook, so Claude Code loads the matching skill as you prompt. Indexed listings install normally and you invoke them yourself.
How does Flowy decide a plugin is a Frontend plugin?
The tag is derived from the plugin's own content, its skill names, descriptions, README and file types, not from a tag someone typed. A plugin appears here only when its real content matches.
Are these Frontend plugins free?
Yes. Flowy is free and open source with nothing gated. You can read every skill before installing, and each listing links to its upstream repository and its creator.

Browse every plugin