Go to homepage

Customizing Icons

Nucleo features powerful tools for editing and customizing icons. You can change icon and background colors, add frames, and adjust stroke values to suit your design needs.

The Icon Editor is used for advanced customizations, allowing changes in icon size, padding, rotation, and the addition or modification of secondary colors.

Accessing the Icon Editor:

  1. Select an icon and press the Space key.
  2. Right-click on an icon and choose 'Edit Icon'.
  3. Double-click on the icon.

The Icon Editor also supports bulk modifications (select multiple icons > right-click > Edit Icons). For example, you can simultaneously adjust the size of multiple icons.

A look at the icon editor

Create dynamic interactions with the Icon Transition Generator. This tool enables you to design a transition between two icons, which can be activated by a click or hover event.

Using the Transition Generator:

  1. To start, select two icons.
  2. Right-click and choose 'Create Transition'.

Once your transition is ready, export it as HTML/CSS/JS, Vue.js, or React code.


Exporting Icons →

Cookie Compliance

We use cookies to give you the best possible website experience. Learn more.