Import Icons

"Current" UI

Our iconography comes from the streamline icon set. The design team has designated a subset of those icons as common. We have added to that list for Build. You can see them here. This script will help import icons into builder-ui should more be added to the common set.

"New" Lowkey UI

In the context of the UI redesign and migration from styled-components to Tailwind / ShadCN, we are now adding icons from the 2025 Platform Designs Figma. Like for the "current" UI, there's a script to help import these new icons into the new set. These script files will have to be modified once the redesign and migration are complete to avoid further confusion.

Usage

"Current" UI

  1. Export the new svg icons from figma and paste them into ./app/src/icons/raw/
  2. Run node scripts/import-icons
  3. Address any errors that come up in the terminal
  4. Your icons should now appear in the docs and be accessible through <Icons.* />

"New" Lowkey UI

  1. Export the new svg icons from figma and paste them into ./app/src/icons/raw-lowkey-ui/
  2. Until the "Current" UI has been completely phased out, in order to run the script you will need to run node scripts/import-icons/index-new.js
  3. For now, some errors referring to the icons styling are being commented out and fixed directly by asking guidance to the Design team.
  4. Until the "Current" UI has been completely phased out, the "New" Lowkey UI icons should be imported with import * as Icon from '../icons/index-new' . Your icons should now appear in the docs and be accessible through <Icon.* />