mirror of
https://codeberg.org/reflect/branding.git
synced 2025-09-14 00:33:42 +02:00
60 lines
2.4 KiB
Markdown
60 lines
2.4 KiB
Markdown
# `/icons`
|
|
The `original.svg` file contains the original Inkscape file which all generated icons derive from. It should not be used directly.
|
|
|
|
## Sizes
|
|
All icons must be generated in the following sizes:
|
|
Width|Height|File path
|
|
--|--|--
|
|
48px|48px|/icons/[[*Extension*]](#extensions)/48x48.[[*Extension*]](#extensions)
|
|
57px|57px|/icons/[[*Extension*]](#extensions)/57x57.[[*Extension*]](#extensions)
|
|
60px|60px|/icons/[[*Extension*]](#extensions)/60x60.[[*Extension*]](#extensions)
|
|
72px|72px|/icons/[[*Extension*]](#extensions)/72x72.[[*Extension*]](#extensions)
|
|
76px|76px|/icons/[[*Extension*]](#extensions)/76x76.[[*Extension*]](#extensions)
|
|
96px|96px|/icons/[[*Extension*]](#extensions)/96x96.[[*Extension*]](#extensions)
|
|
120px|120px|/icons/[[*Extension*]](#extensions)/120x120.[[*Extension*]](#extensions)
|
|
144px|144px|/icons/[[*Extension*]](#extensions)/144x144.[[*Extension*]](#extensions)
|
|
152px|152px|/icons/[[*Extension*]](#extensions)/152x152.[[*Extension*]](#extensions)
|
|
180px|180px|/icons/[[*Extension*]](#extensions)/180x180.[[*Extension*]](#extensions)
|
|
192px|192px|/icons/[[*Extension*]](#extensions)/192x192.[[*Extension*]](#extensions)
|
|
256px|256px|/icons/[[*Extension*]](#extensions)/256x256.[[*Extension*]](#extensions)
|
|
384px|384px|/icons/[[*Extension*]](#extensions)/384x384.[[*Extension*]](#extensions)
|
|
512px|512px|/icons/[[*Extension*]](#extensions)/512x512.[[*Extension*]](#extensions)
|
|
|
|
## Bitmaps
|
|
A lossless-quality `512x512px` bitmap should be generated from `original.svg` which will be used as the base for generating bitmap in the required [sizes](#sizes).
|
|
|
|
Use the lossless bitmap with [Squoosh.app](https://squoosh.app) to generate the required sizes. The following Squoosh preset overrides should be used when generating:
|
|
|
|
### AVIF
|
|
- Encoder: `OxiPNG`
|
|
- Reduce palette: `On`
|
|
- - Colors: `18`
|
|
- Quality: `40`
|
|
- Effort: `10`
|
|
|
|
### PNG
|
|
- Encoder: `OxiPNG`
|
|
- Reduce palette: `On`
|
|
- - Colors: `18`
|
|
- Effort: `6`
|
|
|
|
#### Downscale:
|
|
- Method: "Browser medium quality"
|
|
|
|
### WebP
|
|
- Encoder: `WebP`
|
|
- Reduce palette: `On`
|
|
- - Colors: `18`
|
|
- Effort: `6`
|
|
- Quality: `41`
|
|
|
|
#### Downscale:
|
|
- Method: "Browser medium quality"
|
|
|
|
## Vectors
|
|
Use the `original.svg` file to generate SVG files of the required [sizes](#sizes).
|
|
|
|
All generated SVG:s should be imported to [SVGOMG](https://optimize.svgomg.net/) and exported with the default settings except:
|
|
|
|
- Number precision: `2`
|
|
- Transform precision: `4`
|