Skills
Instructions your agent can follow for layout, type, motion, forms and more.
230 skills
Results
Morphing Iconsby raphaelsalaja
Build icon components that morph between SVG shapes with smooth, line-based transformation.
MotionExternalGitHub stars: 42
Navigation Active Statesby UI Skillbook
Make it unambiguous where the user is, at every level of nested navigation.
Navigation
Nitroby antfu
Nitro is the framework-agnostic server toolkit (powering Nuxt) for building and deploying web servers anywhere. Use when working with nitro.config, server routes/event handlers, route rules, caching, storage, tasks, websockets, or deploying to Node/Bun/Deno/Cloudflare/Vercel.
LayoutExternalGitHub stars: 6K
No Ai Slopby petergyang
Edit drafts into sharper, more human writing while preserving personal voice, or detect AI-slop patterns without rewriting.
TasteExternalGitHub stars: 13K
Oklch Skillby jakubkrehel
Practical OKLCH color workflow skill for building consistent, accessible, and tunable color systems in modern UIs.
VisualExternalGitHub stars: 273
Optical Alignmentby UI Skillbook
Align interface elements by perceived visual weight, not just mathematical geometry.
Visual
Overdriveby pbakaus
Push interfaces into high-impact territory with advanced animation, shaders, and ambitious interaction systems.
MotionExternalGitHub stars: 95.1K
Performanceby addyosmani
Optimize web performance for faster loading and better user experience. Use when asked to "speed up my site", "optimize performance", "reduce load time", "fix slow loading", "improve page speed", or "performance audit".
PerformanceExternalGitHub stars: 3K
Pick Ui Libraryby emilkowalski
Choose an opinionated, trusted library for common frontend tasks including components, motion, charts, interaction, state, and styling.
LayoutExternalGitHub stars: 51.4K
Piniaby antfu
Pinia state management best practices for type-safe Vue stores, getters, and actions.
Design SystemsExternalGitHub stars: 6K
Polishby pbakaus
Final quality pass for spacing, alignment, and consistency to prepare UI for launch.
TasteExternalGitHub stars: 95.1K
Prefer Container Queriesby flornkm
Enforce Tailwind container queries over viewport breakpoints for responsive components. Use when writing or reviewing responsive Tailwind code, when a component needs to adapt to its available space (cards, sidebars, lists, panels, anything reused in different layouts), or when migrating sm:/md:/lg: classes to @container variants.
LayoutExternalGitHub stars: 115
Pricing Pageby MengTo
Use when building a pricing page with clear plan comparison, emphasis, and conversion-oriented layout.
VisualExternalGitHub stars: 7.1K
Product Design Harnessby cis2042
Decide whether a product direction, feature or workflow should continue, be verified or be reframed before anyone builds it, with a structured verdict and next action.
TasteReviewedExternalGitHub stars: 19
Progressive Blurby MengTo
Use when applying blur transitions or layered depth effects that need to feel smooth and controlled.
VisualExternalGitHub stars: 7.1K
Prototypeby mattpocock
Builds throwaway prototypes to answer design or logic questions quickly.
LayoutExternalGitHub stars: 306.5K
Prototypeby emilkowalski
Build multiple genuinely different UI variants behind a visual picker so the strongest direction can be evaluated and promoted.
LayoutExternalGitHub stars: 51.4K
Pseudo Elementsby raphaelsalaja
Audit CSS pseudo-elements and View Transitions usage for hover effects, decorative layers, and transitions.
MotionExternalGitHub stars: 42
Quieterby pbakaus
Tone down overly intense designs while keeping quality high and preserving hierarchy.
VisualExternalGitHub stars: 95.1K
Rad Spacingby nolanperk
Apply hierarchical spacing variables across Figma layouts using proximity-based 4px and 8px increments from the file's library.
Design SystemsExternalGitHub stars: 14
Ramsby rams
Real-time design feedback skill focused on accessibility, spacing, typography, contrast, and component quality.
VisualExternal
React Router Framework Modeby remix-run
React Router framework-mode patterns for loaders, actions, middleware, route modules, and full-stack rendering flows.
LayoutExternalGitHub stars: 134
Redesign Existing Projectsby Leonxlnx
Audit and upgrade existing interfaces to premium visual quality while preserving product functionality.
TasteExternalGitHub stars: 105.4K
Refine Liveby Jakubantalik
Iteratively refine UI in live sessions with a focus on motion, polish, and interaction detail.
MotionExternalGitHub stars: 5.9K
Scandinavian Designby ericzakariasson
Apply a refined Scandinavian visual system with a neutral black-and-white foundation, restrained sans-serif typography, purposeful product imagery, generous spacing, clear page chapters, and minimal decoration. Use when the user invokes /scandinavian-design or requests a Nordic, monochrome, calm, spacious, restrained, or minimalist interface.
VisualExternalGitHub stars: 412
Scroll Worldby oso95
Build an immersive scroll-scrubbed 3D world landing page for any brand with Higgsfield-generated scenes, seamless camera clips, and a portable scroll-scrub engine.
VisualExternalGitHub stars: 10.7K
Seoby addyosmani
Optimize for search engine visibility and ranking. Use when asked to "improve SEO", "optimize for search", "fix meta tags", "add structured data", "sitemap optimization", or "search engine optimization".
PerformanceExternalGitHub stars: 3K
Setup Matt Pocock Skillsby mattpocock
One-time repo setup for the engineering skill workflow and related conventions.
Design SystemsExternalGitHub stars: 306.5K
Shadcnby shadcn-ui
Project-aware shadcn/ui workflow for searching, adding, composing, and fixing components with correct patterns.
Design SystemsExternalGitHub stars: 126.9K
Shapeby pbakaus
Plan feature UX before coding via a structured design interview that produces an actionable design brief.
InteractionExternalGitHub stars: 95.1K
Signal Geometryby CaliCastle
Create sparse geometric illustrations and posters from concepts or briefs, using precise spatial systems, restrained contrast, and matte paper texture.
VisualExternalGitHub stars: 96
Simple Englishby AminBlg
Write or rewrite technical text with ASD-STE100 Simplified Technical English for clear, unambiguous, translation-friendly documentation and interface copy.
TasteExternalGitHub stars: 4.1K
Siteplane Alertby UI Skillbook
An inline message that stays in the layout, styled by tone, with actions and a dismiss button if needed.
Siteplane UI
Siteplane Area Chartby UI Skillbook
Filled areas over time, overlaid or stacked, that show how big a measure is and how its parts add up.
Siteplane UI
Siteplane Avatarby UI Skillbook
A round image for a user or account, showing initials or an icon instead when no picture is available.
Siteplane UI
Siteplane Avatar Groupby UI Skillbook
A facepile: several avatars overlapped in a row with an optional count of the people not shown.
Siteplane UI
Siteplane Badgeby UI Skillbook
A compact label for a status, category, plan or count, with semantic colour variants and fixed sizes.
Siteplane UI
Siteplane Bar Chartby UI Skillbook
Columns or horizontal bars that compare values across categories, grouped or stacked, with keyboard tooltips.
Siteplane UI
Siteplane Bar Listby UI Skillbook
A ranked list of labels with a bar behind each, sized against the largest value.
Siteplane UI
Siteplane Bubbleby UI Skillbook
The surface for a chat message's text, with variants for sender, assistant replies and errors.
Siteplane UI
Siteplane Cardby UI Skillbook
A surface that groups related content and actions, with header, panel, footer and framed-section parts.
Siteplane UI
Siteplane Codeby UI Skillbook
Inline code and code blocks with optional highlighting, titles, line numbers, marked lines, masking and copy.
Siteplane UI
Siteplane Color Pickerby UI Skillbook
A trigger that opens a hex color editor with a saturation area, hue slider and RGB fields.
Siteplane UI
Siteplane Color Swatch Pickerby UI Skillbook
A row of color or image swatches for choosing one option from a palette your app defines.
Siteplane UI
Siteplane Empty Stateby UI Skillbook
A centred block, with optional media and actions, telling people why there is nothing here yet and how to proceed.
Siteplane UI
Siteplane File Type Iconby UI Skillbook
A document-sheet icon that shows a file's type and extension, picked from its name.
Siteplane UI
Siteplane Frameby UI Skillbook
A muted surface that groups raised panels with an optional header, descriptions and footer.
Siteplane UI
Siteplane Glassby UI Skillbook
Frosted, see-through takes on Card, Button, Menu, Context Menu, Popover and Tooltip, meant to sit on top of photos.
Siteplane UI
Siteplane Kbdby UI Skillbook
Styled notation for a keyboard key or a key combination inside text, buttons or menus.
Siteplane UI
Siteplane Line Chartby UI Skillbook
Lines on a shared axis that show how one or more measures rise and fall over time or ordered steps.
Siteplane UI
Siteplane Markerby UI Skillbook
A low-key line between chat messages for things like status updates, system notes or date dividers.
Siteplane UI
Siteplane Meterby UI Skillbook
A bar for a value inside fixed bounds, like storage used, that can carry a status tone.
Siteplane UI
Siteplane Pie Chartby UI Skillbook
A donut or pie that shows how one total splits into a few shares, with an optional figure in the hole.
Siteplane UI
Siteplane Preview Cardby UI Skillbook
Hovering or focusing a link opens this card with a preview of where it goes, so people stay on the page.
Siteplane UI
Siteplane Progressby UI Skillbook
A bar or circle that reports how far a task has got, or that it is still under way.
Siteplane UI
Siteplane Separatorby UI Skillbook
A horizontal or vertical line that divides related sections or controls.
Siteplane UI
Siteplane Skeletonby UI Skillbook
Decorative shapes that stand in for content while it loads, keeping the layout steady.
Siteplane UI
Siteplane Sparklineby UI Skillbook
A tiny axis-free chart that shows the shape of a trend next to the number it belongs to.
Siteplane UI
Siteplane Spinnerby UI Skillbook
A looping animation that shows work is under way when its duration is unknown.
Siteplane UI
Siteplane Timelineby UI Skillbook
A vertical list of events in time order with coloured or icon markers and an optional now line.
Siteplane UI