Design and development tools that integrate the system into your daily process—from Figma libraries to code packages.
Design and development tools that integrate the system into your daily process—from Figma libraries to code packages.
Bring OneDS into your AI coding assistant. The OneDS Plugin teaches Claude Code, GitHub Copilot, and Cursor how the design system actually works, pairing on-demand skills, specialized agents, and persistent rules to handle everything from building components and translating Figma designs to migrating legacy OWC code and catching accessibility issues before you do.
Who uses it?
Frontend developers building web apps with OneDS through AI coding assistants.
Why it matters
It gives your AI assistant real OneDS context, helping it suggest the right components, tokens, and patterns so generated code stays closer to the design system and accessibility standards.
The OneDS Create App CLI simplifies the setup of new React applications by leveraging the create-vite foundation. It initializes projects with the OneDS design system pre-integrated, including automatic configuration for CI/CD pipelines, dependency update management, and a robust, pre-configured testing environment.
Who uses it?
Tool for Frontend developers building web apps with OneDS.
Why it matters
Increase efficiency of coding using OneDS Web library.
Icon Helper is a productivity plugin that transforms a raw icon frame into a fully-structured, scalable icon component set in one click.
Who uses it?
Designers.
Why it matters
Because it automates the conversion of a raw icon frame into a design-system-ready component, removing manual steps and human error.
The OneDS Spacing Inspector is a Figma plugin built to automate the annotation of spacing and layout properties across components, instances, and frames.
Who uses it?
Designers and Developers.
Why it matters
This plugin reads Figma's layout data to auto-generate accurate, consistent, up-to-date annotations.