geticon
geticon copied to clipboard
Reorganization of the project
Plan - make an overhaul of the project (repo):
- [ ] fetch and periodically auto-update all icons from several sources, including:
- icons modified / added by myself or contributors of this repo
- VectorLogoZone
- gilbarbara/logos
- simple-icons
- [ ] make a Next.js based website, there will be an index page, each icon will have its own webpage as well
- [ ] GUI tool on the website, to generate icon list HTML code
- [ ] release a npm package (#1)
- [ ] CLI tool (w/ config) to generate icon list HTML code and insert into README.md or other files
- the above website & npm package will be written in TypeScript
- [ ] Icon spec:
- SOURCE (/icons/):
- FORMAT:
- SVG only
- optional, prefered nominal size (the larger one of width & height) = 256(px)
- no whitespace (i.e. canvas should fit the content), unless, in very rare cases, the image has whitespace per se
- with
viewBoxwithoutwidthorheight - no xml declaration (because it's not needed)
- the source SVGs had whitespace removed with Inkscape (script) and were optimized with SVGO (settings), but not minified (i.e. remove newlines and indentations)
- text must be converted to outline, non-outline text with unknown font is not acceptable
- VERSION:
- primary is square shape icon
- possibly with secondary versions which are rectancle shape logos or other icons
- night mode icon set also possible (#2)
- FORMAT:
- OUTPUT (/dist/?):
- FORMAT:
- SVG (minified)
- Original size (
viewBoxw/owidth/height) (optimization only) (/dist/svg/) - square, nominally 256 x 256 px (
viewBoxw/owidth/height) (/dist/svg_sqr/) - (maybe) square, nominally 22 x 22 px (
viewBoxANDwidth,height) just for a GitHub mobile app bug (icon becomes very big and HTML img width does not work) (/dist/svg22/)
- Original size (
- PNG
- 256 x 256 px (/dist/png/)
- SVG (minified)
- FORMAT:
- SOURCE (/icons/):
- [ ] for the aliases, treat names with spaces and without spaces as the same, case-insensitive
- [ ] test. logo.json file should be validated
See /data/types/icons.ts for icons.json data type. Example:
{
"name": "JavaScript",
"aliases": [
"js"
],
"tags": [
"javascript",
"programming language"
],
"url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript",
"files": [
{
"filename": "javascript.svg",
"type": "icon",
"desc": "JavaScript Icon",
"tags": [
"yellow",
],
"source": "https://github.com/gilbarbara/logos/raw/master/logos/javascript.svg"
},
{
"filename": "javascript2.svg",
"type": "logo",
"desc": "JavaScript Text Logo",
"tags": [
"yellow",
"text"
],
"source": "../javascript2.svg"
}
]
},
Moved from README:
- [ ] bug: can't show Google Analytics logo?
- [ ] allow more customization
- [ ] web tool
- [ ] able to extract list from a package.json file
- [ ] insert code into README.md automatically, possible to use CI
- [ ] possible to combine all icon svgs and render as one svg
- [ ] more icons
- [ ] able to generate acronym icons for packages without icon
- [ ] release as an npm package
@tomchen is this project no longer active? There seems to be no activity since past 6 months
@dheerajpg in fact it was not active until now - I'll update it soon
cool mate, glad to see you again. Hope you can evolve it further and make a website where users can search for these icons as it's hard to find such repos on github search so it's better if you have these hosted so that people can share around and discover on search engines