# Overview

The integration addons add extra features to the respective builders to make developing quicker. For example, the builders will import all colors, classes and variables directly from Core Framework so that they are constantly synchronized. 

You will no longer need to type out the full class names or variable names, as the integration addons also allow not only for auto-suggestions, but also a unique variable UI.

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td><strong>Bricks Builder</strong></td><td>Learn how to set up the Bricks Builder Integration addon as well as configure styles.</td><td></td><td><a href="bricks-builder">bricks-builder</a></td><td><a href="https://949277485-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fp10Tm4nYjo9MojbZ6zQt%2Fuploads%2F6x2XRwvEqMnVZMIgWnEk%2Fbricks-builder-integration.webp?alt=media&#x26;token=59c25e0c-ce81-4fb0-9800-8c5b7940f21b">bricks-builder-integration.webp</a></td></tr><tr><td><strong>Oxygen Builder</strong></td><td>Learn how to set up the Oxygen Builder Integration addon as well as configure styles.</td><td></td><td><a href="oxygen-builder">oxygen-builder</a></td><td><a href="https://949277485-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fp10Tm4nYjo9MojbZ6zQt%2Fuploads%2Fq2g46wo43nmgNloRsw98%2Foxygen-builder-integration.webp?alt=media&#x26;token=bdfff267-c01a-49e3-b19d-ae6e0dc94731">oxygen-builder-integration.webp</a></td></tr><tr><td><strong>Gutenberg</strong></td><td>Learn how to set up the Gutenberg Integration addon.</td><td></td><td></td><td><a href="https://949277485-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fp10Tm4nYjo9MojbZ6zQt%2Fuploads%2FujjdbDEqoQ73iihVOtqS%2Fgutenberg-integration.webp?alt=media&#x26;token=36fa6354-4510-45ab-bfa2-cbb1c87344cd">gutenberg-integration.webp</a></td></tr><tr><td><strong>Figma Addon</strong></td><td>Learn how to get started using Core Framework within Figma, and sync between your WordPress site and Figma!</td><td></td><td></td><td><a href="https://949277485-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fp10Tm4nYjo9MojbZ6zQt%2Fuploads%2FNO8rU09TcYIbKtuJ8RiP%2Ffigma-integration.webp?alt=media&#x26;token=2e2c3d44-af75-4274-8277-d6a72a953da1">figma-integration.webp</a></td></tr></tbody></table>

### Features

* Variable UI - Select variables from the visual UI that can be accessed by right-clicking on the input.
* Variable auto-suggestion - Custom variables are automatically suggested in custom auto-suggestion dropdowns. Sorted by relevance.
* Sync classes with Oxygen Builder and Bricks Builder native auto-suggest fields.
* Preview classes and variables by hovering over them.
* Preview dark mode by toggling the switch.

&#x20;