Build Using the Element Island

Layers Panel
Variables
Symbols
Pop-up Builder
Media Manager
Figma to Kirki
API Integrations
Review and Publish
Layers Panel
Variables
Symbols
Pop-up Builder
Media Manager
Figma to Kirki
API Integrations
Review and Publish
Build Using the Element Island

From Kirki’s Element Island, you can quickly access the basic building blocks for your website and add them directly to the canvas.

This toolbar is essentially your main hub for building a site from scratch, giving you quick access to the five atomic elements, the Select tools, and Comments.

You can use these tools together with the Design Tab on the Right Panel to build your basic page layouts quickly and effortlessly.

Select Tools

The Select tool is enabled by default. Click on the dropdown to access the Hand tool:

  • Select – Click to select elements, click & drag to move them, or click & drag the infinite canvas to pan while interacting with elements.
  • Hand – Click and drag to pan around the infinite canvas without selecting or moving elements.

💡 Tip: You can press and hold the space bar to activate the Hand tool temporarily.

Learn more about the Infinite Canvas.

Structure Elements

Next, start building your page’s layout using the structural elements on the toolbar:

  • Div – A generic container used to group content together. Divs help you organize elements neatly within your page.
  • Section – Click the dropdown arrow beside Div to select Section. Sections are used to group large, meaningful parts of your page, like a Header, Hero, Footer, etc.

Once selected, click or draw on the canvas to add your element.

💡 Tip: Divs and Sections default to Block (stacked vertically). Switch to Flex or Grid from Layout options in the Design Tab for more dynamic layouts.

Text Element

Text is a core part of any website. Use the Text element on the Element Island to quickly place paragraphs anywhere on your page.

To add it to your page, select the Text element and do either of the following:

  • Click once on the canvas to create a text layer that spans the full horizontal space and expands automatically as you type.
  • Click and drag on the canvas to create a text layer with a specific height and width.

Learn more about Text & Typography.

Media Elements

Finally, enhance your page by adding visual content:

  • Image – Select this option, then click or draw on the canvas to add an image element to your page. Learn more about Images.
  • Video – Click the dropdown arrow beside Image to select Video, then click or draw on the canvas to add a video element. Learn more about Videos.

Comments

You can also easily access the Comment tool from the Element Island.

This lets you quickly mark the canvas with ideas or feedback, view the full comment thread, and reply to other comments directly on the canvas.

This makes it easier to discuss updates, iterate on designs, and collaborate as a team seamlessly.

Learn more about Comments.

Was this page helpful?

Our website uses cookies to improve your browsing experience on our website. By continuing to use this website, you agree to their use. For details, please check our Privacy Policy.