Rocksite Kit

Figma UI Kit + WordPress Plugin to streamline the process of designing and building websites in Figma & Gutenberg

Figma UI Kit:

Design your website to fit for the WordPress Kadence Blocks from start.

UI Kit that helps you start out any Kadence Blocks project. It includes basic styleguide and design variables that can be mapped in Kadence block settings, such as colors, spacing and typography.

Rocksite Design Library:

Implement your design based on predefined section templates coded by experts.

Rocksite Sections is a collection of sections and blocks using Kadence Blocks, which is built to speed up your WordPress website developments effectively. You can easily deploy your design prepared in Figma or start creating directly in the editor. Select all the necessary sections from the catalog and add them with one click to the editor. You can also import all design variables from Figma with a dedicated option.


Streamline the process in 4 steps

Step 1
Figma: Open Rocksite Kit

Customize Colors, Typographs and Design variables in the integrated styleguide. Create your layouts using sections and components

Step 2
Figma: Export Design Tokens

Use variables2css Free Figma Plugin to export design variables. Choose Kadence Variables collection. Click on Generate Button and copy generated variables

Step 3
WordPress: Install Rocksite

Downlowad Rocksite Sections Plugin from WordPress directory. After Installation go to seetings page and copy variables generated by Figma Plugin

Step 4
WordPress: Create your layout

Open your WordPress editor, click on Design Library button
and insert all necessary sections based on your design. Now you can publish the project

Our Pricing

The whole set is free

Figma UI Kit


  • 30+ predefined Sections Based on Kadence Blocks
  • Lightweight design system
  • Friendly interface that allows you to select a component and add it to your WordPress site with a click
Gutenberg Design Library


  • 30+ section templates that implement sections from Figma UI Kit
  • Plugin integrated with Kadence Cloud
  • Friendly interface that allows you to select a component and add it to your WordPress site with a click