Resources

Design Resources

Everything you need to design with ply outside of code — the full Figma component library, built entirely from ply variables, plus tooling to keep your AI design work on-system.

Figma

Figma Component Library

The complete ply component library in Figma. Every component is built from the same design tokens as the framework — colors, spacing, radius, and the shared control sizing scale all map to --ply-* variables, so what you design is what ships. Page structure mirrors this documentation: Design, then Buttons, Forms, Navigation, Tables, and Dialogs & Alerts. Components, variables, and text styles included for light and dark mode. Download the .fig and drag it into Figma (File → Import).

AI Design

Claude Design Instruction Set

A drop-in instruction set that teaches Claude to design with ply’s components and variables — keeping generated layouts on-system, themeable, and accessible from the first prompt.

Claude Design Instructions Coming soon

In progress. Check back soon — or follow along on GitHub.

More

Looking for code?

Start with Installation, browse the components, or read the AI Agents guide for PLY.md.