Packs

6 packs

Design System Foundation

Create design tokens, principles, and naming conventions for a new design system.

16 skills · pack

Design System Audit and Remediation

Identify design debt, audit tokens, and enforce consistency across a product.

14 skills · pack

Publish Mobile-First Page

Scaffold and publish a mobile-first page with responsive layout and design tokens.

4 skills · pack

React Motion UI System

Install foundational motion tokens, UI patterns, and accessibility enforcement for React/Next.js.

5 skills · pack

Design system skills: component specs, design tokens, naming conventions, spacing and grid systems, accessibility standards, and documentation.

11 skills · pack

Visual Critique

Visual critique skills: hierarchy analysis, brand consistency checks against mood/voice/tokens, composition evaluation, and typography audits — with a /critique-screen command that compiles a prioritised fix list.

7 skills · pack

Results for “tokens”

6 skills

Extrai tokens de cor, tipografia, grid, logo e componentes do Figma e grava na seção 3 do contexto, marcando itens inferidos quando não há acesso ao Figma.

Import Figma designs into HyperFrames compositions as frozen assets, brand tokens, components, motion animations, and shaders.

Integrates Figma Dev Mode via MCP to extract assets, components, styles, and design tokens, converting designs to code with high fidelity.

More results

Translates between Figma designs and Vue 3 + shadcn-vue code, mapping Auto Layout to Tailwind, extracting design tokens, and pushing components back to Figma via MCP.

Composes final brand assets in Figma from generated images, applying text, brand tokens, layout, and grid. Optional layer: use when Figma is connected and an editable file is needed. Without Figma, delivers a composition specification.

Generates a complete Figma Make prompt package with context primer, checkpoint, build prompts, and iteration templates for designing UI pages, components, or screens.