Menu

Guide

Nucleo is a beautiful library of vector icons, and a powerful application to collect, customize and export all your icons.

The Interface

Nucleo interface is organized in 6 main areas:

  • Filters → search + icons style + icon sets + grid sizes → use the filters to narrow the icons results displayed within the Icons Gallery
  • Icons Gallery → the list of all your icons
  • Navigation → the app is structured in 3 main sections: All Icons, Favourites and Projects. Use the navitation to browse from one section to the others.
  • Icon Info → Icon name and tags
  • Customization tools → Edit icon colors, thickness and add frames. Please note that some advanced customization options work only if applied to Nucleo icons.
  • Exporter → use this button to export the icons in different formats and resolutions.
Nucleo interface

Account Settings

In the Settings page (accessible by clicking Account > Settings or pressing ⌘+, on Mac or Ctrl+, on Windows), you will be able to change some application settings, like the file format you want to use for the icons drag out or the folder where you want to export your icons

If you are a Nucleo Pro user and want to sync your icons library on two devices, you can select, as Library location, the same Dropbox folder on both your machines. Please note that this feature was not developed for simultaneous working on multiple devices, but just to allow you to use the same library. If you make a change on one of the devices, please wait for dropbox to complete the sync process before making changes on the other device.

Importing Icons

You can use Nucleo to import your own icons. To create a new Set of icons, use the + symbol in the app left panel, or right-click on the left panel > Create New Set. Another option is to drag your icons over the app.

Create new set

Import or drag you icons on the ‘Create New Set’ modal, select the icons style and your set name. Then press “Upload Icons” to create the new set.

A few limitations apply to icons importing:

  1. Only SVG icons can be imported in Nucleo; all other formats will be ignored.
  2. You can either drag and import SVG files, SVG fonts, folders containing SVG files or .iconjar files.
  3. Nucleo allows one level of indentation only: if you import a folder with multiple sub-folders, only the first sub-level will be imported (deeper sub-folders will be merged).
Create new set modal

Exporting Icons

Nucleo allows you to export your icons in multiple formats; use the Export button (visible when one or multiple icons have been selected) or press Cmd+E on Mac (Ctrl+E on Windows) to trigger the export window. Choose one or multiple formats, and download your icons. Please note that the icons folder where the icons are exported can be changed from the Settings window.

Export icons modal

You will be able to choose among the following formats:

  • SVG: download your icons as single svg files, svg sprite or svg <symbol>
  • PNG: download your icons at multiple resolutions and/or select a ready-to-use iOS or Android format
  • PDF
  • Icon Font

Favourites & Projects

While the All Icons page is intended for organizing icons at a macro level, you can use Favourites and Projects to organize your icons at a micro level.

  • Favourites → In order to mark an icon as favourite, you just need to click on the small “star” symbol on top-right of each icon. To access the favourites page, just click on Favourites from the main navigation in the top-right of the app.
  • Projects → To add icons to a project, you can either select some icons, then right-click > Add to Project, or click the “Add to Project” button in the export area (bottom-right of the app). To access the projects page, just click on Projects from the main navigation in the top-right of the app

Teams

You can set up a team on Nucleo to share icons and collaborate on projects with your teammates, as well as give your colleagues access to the Nucleo library.

The person that creates the team is also the admin. Once the team has been created, the admin can access and manage the team from the team page.

Teams page

By selecting a team from the Teams page, you can access the Edit Team Info page, where you can invite members. In order to invite a teammate, simply click on “Add members”. Inside the modal, you can either enter an email address (or multiple, comma separated email addresses), or import a list of email addresses (either a .txt file with a list of comma separated email addresses, or a .csv file).

After the invitations have been sent out, you'll see a list of email addresses populating the team members area. When a team member accepts the invitation (sent via email), the circle on the right of her/his email address turns green. Note: don’t forget to click “Save” before leaving the page.

List of team members

In order to share projects with your teammates, you need to set up a Dropbox folder and make sure all team members have access to this folder. You can set up this folder from the Settings page:

Set up Dropbox folder

In the Projects page you'll see all personal projects under the My Projects list, while the team projects will be shown as a separate list. To share a project, right-click on a project from the My Projects list > Share with > Team Name.

In order to sync your team projects and see changes made by other team members, press the "sync/refresh" icon on the right of the team name.

Shortcuts

Action Mac Windows
Focus on Search ⌘+F Ctrl+F
Reset Filters ⌘+R Ctrl+R
Show Settings ⌘+, Ctrl+,
Select all Icons ⌘+A Ctrl+A
Copy Icon Shift+⌘+C Shift+Ctrl+C
Copy SVG code Shift+⌘+T Shift+Ctrl+T
Export Window ⌘+E Ctrl+E
Add to Project ⌘+P Ctrl+P
Close Modal Windows Esc Esc
Delete/Remove Icons ⌘+Delete Ctrl+Delete
Hide/Show Side Panels ⌘+3 Ctrl+3
Top