← All features DESIGN SYSTEM

Bring reusable design direction into the session.

Genable can organize Figma pages and sections as it builds. You can also import a design.md into the plugin's skill library and attach it to a chat turn, so the same documented tokens and conventions can guide more than one prompt.

AN EXAMPLE BRIEF

Use the attached Product UI design.md. Create pages for Foundations / Components / Patterns. In Foundations, show the documented color, typography, and spacing tokens. Group each component family in a named Section and follow the naming rules from the document.

WHAT THE AGENT CAN DO

Create and switch between named Figma pages
Group related work in Sections and named frames
Create variables, components, and examples in the same file
Import design.md files as user-managed skills
Attach the relevant design document when a prompt needs that context
Inspect naming and structure before continuing

GOOD FIT

Design-system foundations, component-library starts, client handoffs, and any workflow that benefits from documented constraints.

USER-IMPORTED DESIGN CONTEXT

Import a design.md into the skill library.

Add the document in Genable, then attach it to the chat turn that should use it. This keeps the design direction explicit and user-managed; importing a file does not silently apply it to every generation.

Read the Genable docs → Adapt an example brief →

Try it → See checks →