Welcome to the AG Grid Figma Design Systems repo, created to help Product Designers prototype and customise AG Grid and AG Studio applications with ease.
We supply two Figma community files:
This directory contains the following:
/ag-grid-figma-local-variables-to-theme/Transform exported Figma local variables json into working AG Grid and AG Studio themes/archive/: Archived resources for the AG Grid Figma Design System.
The AG Grid Figma Design System supports:
- Quartz, and Alpine themes in light mode & darkmode
- All core Grid components, which are a mirror image of the components in the AG Grid library
The AG Studio Figma Design System supports:
- Light and dark modes
- The AG Studio interface components, which mirror the components in the AG Studio library
Both design systems support:
- Conversion of Figma local variables into AG Grid and AG Studio theme objects with the
/ag-grid-figma-local-variables-to-theme/sample project
To start working with either design system, visit its Figma community page and click "Open in Figma". The design system will open directly in Figma and you're ready to start designing:
- AG Grid Design System — for designing AG Grid applications
- AG Studio Design System — for designing AG Studio applications
You will use a file by duplicating it to your Figma workspace. Whilst we regularly update the design systems, your duplicated files will not receive any updates automatically.
For more information about how Figma community files function, please review the Figma help pages on community files.
If you have created your own theme in Figma using the local variables, you can export those values as json directly from Figma's local variables panel. You can then use that tokens json to create a real AG Grid or AG Studio theme.
An example project and full instructions are included in the /ag-grid-figma-local-variables-to-theme/ directory.
AG Grid Enterprise customers can request support or suggest features and improvements via Zenhub. Community users can file bug reports via AG Grid Github issues.