Connect your BreakColorUI project to Breakdance (or Oxygen) and get every variable in your design system one right-click away from any input in the builder.

No exporting CSS, no manual pasting, no re-importing every time you update the system.

What's included
- Color palettes — Brand, Neutral and Custom — with Dark/Light toggle
- Global semantic colors (Headings, Brand, Links, Site background, ...)
- Fluid typography with clamp() — H0 through H6, body, and Breakdance variants
- Spacing system — Component + Section
- Page Width and Border Radius preset
- CSS variable mode or raw mode (clamp/hex/px) — your choice

How to use
1. Build your system in the BreakColorUI dashboard
2. Install the "BreakColorUI Sync" plugin in WordPress
3. Connect with one click — PKCE flow, no API keys to copy
4. Right-click any input in the builder → the modal opens with the right tokens for that input type (color, typography, spacing, radius, ...)

Real-time sync
Edit the system in the dashboard and the plugin receives the change via webhook in seconds. Plugin updates roll out automatically through WordPress (within 12h, or instantly via "Check for updates").

Supported builders
- Breakdance Page Builder
- Oxygen Builder