Icons

This system uses Material Design's icon font. You can access all icons available in the Material Design library without the need to upload SVGs into your assets panel.

Use icons

Important! Make sure to have Icon Embed element on each page to display the icons. This symbol contains a necessary code to display Material Icons in Webflow and published pages.

Replacing the icon

  1. Go to https://fonts.google.com/icons?selected=Material+Icons
  2. Search for the icon you want to insert.
  3. Select the icon and click on the copy icon under icon name in the right panel, for example 'account_circle'.
  4. Select the 'Icon Small' symbol on the canvas.
  5. Paste the icon name from clipboard in the icon text block.

Icon Theme

  1. Click on the icon: account_box
  2. Rename Material Icons class to the name of desired theme: Material Icons Outlined , Material Icons Round , Material Icons Sharp

Icon Components

Feature Icon Light
star
Feature Icon Dark
star
Icon Small
star

Components

Components are the reusable building blocks of SystemFlow. Each component meets a specific interaction or UI need, and has been specifically created to work together to create patterns and intuitive user experiences.

Sections

Use sections to build landing pages in a swift. SystemFlow Lite contains 2 out of 15 section categories available in the full version.

Get access to all SystemFlow components in Full Version