> For the complete documentation index, see [llms.txt](https://docs.coreframework.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.coreframework.com/builder-integrations/overview.md).

# Overview

At Core Framework, we offer integration addons for specific builders to make developing much more efficient. Click the cards below to learn more about the individual addons we offer.

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="/builder-integrations/bricks-builder.md">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&amp;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="/builder-integrations/oxygen-builder.md">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&amp;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&amp;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&amp;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;