Design skills

Browse reusable Agent Skills, each with a clear purpose and practical guidance.

antd-theme-customization

Customize Ant Design theme using Design Tokens and ConfigProvider. Use when adjusting visual styles, colors, spacing, or other theme properties in an Ant Design project.

98.74k repo starsObserved in 1 repos
Design

html-ppt-zhangzara-raw-grid

A brutalist poster-series case study for a music festival — the concept, the system, and how it scaled across formats. Built as a decision-grade design craft deck for design peers, client.

78.60k repo starsObserved in 1 repos
Design

social-spotify-card

Spotify Now Playing-style card with album art, progress bar, and playback controls, suited to video overlays or personal homepages.

78.60k repo starsObserved in 1 repos
Design

webgl-raymarched-hero

A real-time raymarched 3D hero — soft-shadowed morphing metaballs with a fresnel rim light, sphere-traced per pixel in a fragment shader with a slow camera orbit. No meshes, no textures. Rendered as a single self-contained `index.html`. Use when the brief asks for a "raymarch", "signed distance field", "SDF", "3D hero", "metaballs", "blobs", or a shader-based 3D scene. Open Design serves this in powered-preview mode so the GPU stack actually runs.

78.60k repo starsObserved in 1 repos
Design

understand-figma

Analyze a Figma file via the Figma REST API and generate an interactive design knowledge graph (pages, screens, components, component sets, instances, design tokens) with a kind:"design" dashboard.

74.30k repo starsObserved in 3 repos
Design

paperclip-capsules

Generate, implement, or review Paperclip capsule visuals. Use for capsule art, agent capsules, heartbeat status capsules, identicons, capsule banks, or brand-usage validation.

73.82k repo starsObserved in 1 repos
Design

accessible-tables

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Use semantic table markup for screen readers. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

73.22k repo starsObserved in 1 repos
Design

accessible-tooltips

Use when reviewing templates, rendered HTML, or shared components related to Create accessible tooltips. Validate the final browser-facing markup, not just the source framework abstraction.

73.22k repo starsObserved in 1 repos
Design

alt-text

Use when reviewing image assets, markup, and CDN or build transforms related to Provide meaningful alt text for images. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

73.22k repo starsObserved in 1 repos
Design

anchor-smooth-scroll

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Provide instant anchor scroll option. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

73.22k repo starsObserved in 1 repos
Design