Theme kit

FrameKit sets up a child theme for the builder you use, with SCSS you can edit, a layout grid from your Figma grids, and compiled CSS. Logo, menus and Additional CSS carry over from the parent theme.

figmakit-<builder>/  src/scss/_vars.scss  src/scss/_layout.scss  src/scss/_variants.scss  src/scss/_custom.scss  dist/figmakit.css

Oxygen loads no theme, so on an Oxygen site your tokens live in Oxygen variables and selectors instead.

The top band and the footer you drew become the builder's own header and footer templates, used on every page: Elementor Pro templates, the Divi Theme Builder, Bricks templates, Oxygen templates or block template parts. Navigation drawn in Figma becomes a WordPress menu.

Buttons come as Primary, Secondary, Outline, Ghost and Text, in three sizes. Cards and sections get their own variants. Edit each one with token pickers and a hover state, and check the text contrast before you save. Variants from your Figma components are added to the list. Every variant is a theme class you can edit in the UI or in _custom.scss.

Turn this on for Gutenberg imports. Cards, CTAs, FAQs and your own components then become ACF blocks with their fields already filled in. If a block wouldn't look exactly the same, FrameKit keeps core blocks and tells you why.