All Icons is a Penpot plugin that allows you to easily access icons from various icon libraries and add them to your project.
- Sign in to Penpot (the official SaaS version).
- Trigger the installation of the plugin by following the link below:
Install All Icons plugin - Follow the instructions on the screen.
The installer will inform you about the permissions requested by the plugin:
- Content's write access is necessary for the icon insertion.
- Content's read access is necessary to save and retrieve the plugin's settings e.g. open icon sets, selected style variants.
- Go to a Penpot project.
- Open the plugin through the plugin manager.
Note: If you manage a self-hosted Penpot instance, you can create an All Icons installation link by using the following pattern
<penpot-instance-origin>/#?plugin=https://allicons.authormore.com/manifest.json
where<penpot-instance-origin>
is the URL of your Penpot instance.
- Go to a Penpot project.
- Open the plugin manager.
- Fill the plugin URL input with
https://allicons.authormore.com/manifest.json
. - Click the "Install" button.
- Follow the instructions on the screen.
The installer will inform you about the permissions requested by the plugin:
- Content's write access is necessary for the icon insertion.
- Content's read access is necessary to save and retrieve the plugin's settings e.g. open icon sets, selected style variants.
- Use the plugin manager to open the plugin.
You need to have an environment with Node.js installed to work on the plugin.
- Clone the repository.
- Run
npm ci
to install the dependencies. - Run
npm run generate-data
to generate the data for icon libraries. - Run
npm run dev
to start the server. - Open Penpot and go to the plugin manager.
- Add a new plugin with the URL
https://localhost:4173/manifest.json
. - Use the plugin manager to open the plugin.
Currently the development setup is using the production build in watch mode for the plugin script. This means development tools like source maps, hot module replacement are not available, and you need to reload the plugin manually after making changes in the script. The app part is running a development server.
Readme image's background pattern by Jean-Philippe Delberghe.