Creating icons
The Arcticons style
When creating icons, there are three key points to test your design to:
Recognizable: There needs to be a clear link with the app, such as the word mark or logo.
Minimalistic: Try using as fewer lines as possible, resulting in an easy-to-read icon.
Elegant: Strive for the best-looking design you can make with the source material that you're working with. This is a bit of a personal preference, but make adjustments when necessary to keep your design clean.
Basic principles
The size of your document should always be 48×48 px.
Every line has a stroke thickness of 1 px and the color should always be
#ffffff(white).Dots are 1.5×1.5 px and have a fill (and no stroke) that should also be white.
The maximum size of your icon should fit into the template circle icon (43×43 px).
Square-like icons should fit into the square template (37×37 px).
Rectangular icons should fit into the rectangle templates (31×39 px).
We have created our own font for Arcticons icons, all letters, numbers and other glyphs have to use it for consistency.
All lines should have rounded caps & rounded corners.
Try to keep icons as simple as possible, unnecessary lines make icons harder to read.
Exporting & making them work
Export your icons as SVG files.
Make sure to remove the reference image before exporting.
We don't accept icons that are:
rastered (PNG, WebP)
too cluttered
that don't follow the basic principles
Start creating
Vector editing softwareUploading to GitHub
GitHub guideLast updated
Was this helpful?