gridi - Sync design. Ship code.

About this plugin

gridi keeps your code aligned with design.It detects design-code drift from selected Figma elements, updates the relevant code in your GitHub repository, and opens a pull request automatically so your team can review and ship the fix faster.How it works :Select one or more elements in FigmaConnect your GitHub repository and choose the target codebaseRun sync to compare the selected design against the implemented UIgridi identifies mismatches, updates the code, and creates a ready-to-review pull requestWhat gets synced :Layout differences such as spacing, sizing, alignment, and structureVisual styles including colors, borders, radius, shadows, and opacityTypography such as text content, font styles, size, weight, and line heightComponent and UI inconsistencies based on the selected design contextCode changes packaged into a pull request for review and mergeBuilt for designers and developers who want to keep production UI aligned with Figma - without manually finding mismatches, editing code by hand, or coordinating every small visual fix across design and engineering.