Olives: bidirectional sync and one source of truth

Olives: bidirectional sync and one source of truth

A few days ago: Olives could extract components from code.
Today: Full bidirectional sync works end-to-end. One source of truth (ring) to rule them all - design and production.

Last week I started building Olives - a tool that treats code-to-design as a structural problem, not a rendering problem.

Today, the full loop works.

What’s working right now

.30

Forward flow (Code → Figma)

  • Extract component structure, variants, states, design tokens
  • Compile to validated bundle with ownership metadata
  • Import to Figma with proper nesting (atoms, molecules, organisms)
  • Push via API (automated deployment, no manual steps)

Reverse flow (Figma → Code)

  • Export changes from Figma (reverse bundle generation)
  • Field-level diff detection (shows exactly what changed)
  • Conflict classification (safe vs needs manual review)
  • Safe apply (only updates when unambiguous)
  • CI-safe operation (--yes flag, deterministic)

And this is what the round-trip looks like

  1. Code changes → push to Figma
  2. Designer modifies in Figma
  3. Export changes → diff review
  4. Apply to code → push to Figma
  5. Loop complete

What this actually means: no more dual canon. No more “design file vs codebase” drift, because your component library lives in code.

Your design tools sync bidirectionally, changes flow both ways, automatically, and with full traceability.

In practice:

  1. Designer modifies padding in Figma → code updates
  2. Developer adds variant in code → Figma updates
  3. Both changes tracked, classified, applied safely

If you’ve worked on design systems, you know most design tools still treat design and code as separate libraries that need “handoff.”

And that handoff gap is where product drift starts - it starts with one unnoticeable mismatch, then another, until you’re maintaining two sources of truth and neither is fully reliable.

Olives eliminates the gap: code is design. Design is code.
The bridge goes both ways now.

Current state

So right now, everything core works. I’ve validated the round-trip, and the infrastructure is solid (so far) - but the steps are very manual - lots of copy/pasting between IDE and Figma.

Next

Remove manual steps (automate plugin export), and improve fidelity (more patterns, better style parity, CSS/token translation).

After which, I’ll ship it publicly.

The bigger picture

This isn’t just about Figma (if anything, it’s about wanting to migrate out of Figma). It’s about proving design systems can have one canonical source (code) with bidirectional sync to any visual tool.

When that’s established, Figma becomes exactly that - just a tool, devoid of ecosystem lock-in. The one source of truth, your design canon, belongs to you and your team.

Still refining and testing, but the foundation is complete and the loop closes neatly. Looking forward to sharing it when I’m sure it’s not going to nuke your codebase.