1
0
mirror of https://github.com/SimonPistache/famfamfam-silk-svg.git synced 2025-06-08 01:54:20 +02:00
famfamfam-silk-svg/README.md
Simon Priet 7e782cfbff
feat(#162): Upload decorator iconset (#163)
* feat(#162): add all decorators

* fix(#179): Figma Angular gradient translate as CSS conic-gradient

* fix(#220): Replace inner shadow with radial gradient

* fix(#178): Remove diamond inner shadow

It has been replaced with radial gradient

* docs: Update ReadMe with decorators list

Also update icon list to include all recent fixes.
This is a BREAKING CHANGE.
2025-03-14 17:21:13 +01:00

90 lines
5.9 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<img align="center" src="./public/github-cover.png">
# FamFamFam Silk as SVG
> The iconic iconset of the 2010s era from Mark James, remade in SVG for todays needs.
This project contains ~1000 icons in SVG. SVG is lightweight, scalable compared to PNG — and open format, allowing anyone to edit it to his/her needs. I aim to have all the original icons remastered, but also create more up-to-date versions (Smartphones was not a thing back in 2008). Plus, most icons can be mixed with decorators (bullets) to get more meaning.
Scale: <img height=16px src="icons/Cup.svg"> <img height=24px src="icons/Cup.svg"> <img height=32px src="icons/Cup.svg"> <img height=48px src="icons/Cup.svg"> <img height=64px src="icons/Cup.svg">
Mix: ![Cup of caffee](<public/Cup of caffe.svg>) + ![Bullet delete](<icons/Bullet delete.svg>) = ![A cup of caffe with a delete bullet at its bottom right](<public/I should stop caffe.svg>)
Customize: ![Cup of caffee](<public/Cup of caffe.svg>) ![Cup of Matcha latte](<public/Cup of matcha.svg>) ![Cup of Tea](<public/Cup of tea.svg>) ![Cup of water](<public/Cup of water.svg>)
## How to use <img height=30px src="icons/Help.svg">
* Clone or fork the repository.
* Download files from the [icons](./icons/) folder.
Currently available icons:
![All icons](./public/available-icons.png)
![All decorators](./public/available-decorators.png)
### <img height=24px src="icons/Date.svg"> Roadmap
* <img src="icons/Tick.svg"> ~~Access to decorators~~
* <img src="icons/Hourglass.svg"> Access to variants
* <img src="icons/Hourglass.svg"> Access to parts
* <img src="icons/Hourglass.svg"> Designers: Get the Figma UI Kit
## Contributing <img height=30px src="icons/Paintbrush.svg">
Reports, Requests and Contributions are welcomed to this project! I believe that healthy debate and disagreement are essential to a healthy project and community. However, it is never ok to be disrespectful.
### <img height=24px src="icons/Bug.svg">  I would like to report a bug or suggest something!
The issue section is the right place for you to describe your problem. Specific rules applies, and not following them may result in the closing of the issue.
* Issue must have a label related to your topic
* Issue must be sufficiently described, clear and not misleading
* Issue may be flagged as _duplicate_ if the topic is already discussed on another issue.
* There is no garanties that an Issue will be resolved. I have limited bandwidth.
### <img height=24px src="icons/Wand.svg">  Can I create an icon too?
Sure! Please *Fork**Create**Push**Pull Request*, follow the [Pull Request & commits guidelines](#pull-request-and-commit-guidelines), and the [Icon Design guidelines](#icon-design-guidelines) below.
### <img height=24px src="icons/Wrench.svg">  I have fixed this icon, how can I give it back?
Thank you! Please *Fork**Patch**Push**Pull Request* and follow the [Pull Request & commits guidelines](#pull-request-and-commit-guidelines), and the [Icon Design guidelines](#icon-design-guidelines) below.
### Pull Request and Commit Guidelines
- It should stick to the [community's best practices](https://github.com/kubernetes/community/blob/master/contributors/guide/pull-requests.md#best-practices-for-faster-reviews) as close as possible
- It must follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/#summary) principles in commit and PR names.
- It must be related to an issue in this project.
- Authors of contribution are credited (via the Contributor section of Github)
### Icon Design Guidelines
- Icons must be in the **style and spirit of the original work** from Mark James.
- Icons must be in **SVG**.
- Icons must be designed to be **legible in any size from 16×16px to 64×64px**. It must have the right balance between too much details and too little. I recommand using a grid of 16×16 to help.
- Icon improvement based on existing icons must be as close as possible to the original design, especially at 16×16px.
- Icon must render without visual artefact in today's broswer such as WebKit, Blink, Gecko. (Test your icons)
## License <img height=30px src="icons/Report.svg">
This project is licensed under the [**Creative Commons BY 4**](https://creativecommons.org/licenses/by/4.0/) license. This content is distributed in the hope that it will be useful, but **without any warranty**; without even the implied warranty of **merchantability** or **fitness for a particular purpose**.
## Acknowlegements <img height=30px src="icons/Heart.svg">
The Original *FamFamFam Silk* icon pack ([github](https://github.com/markjames/famfamfam-silk-icons) • [website](http://www.famfamfam.com/lab/icons/silk/)) remains the property of Mark James. Mark, please have my thanks and salute for your great work.
#### Fonts
- [Fira Mono](https://github.com/mozilla/Fira)
- [Fira Sans](https://github.com/mozilla/Fira)
- [Fira Sans Condensed](https://github.com/mozilla/Fira)
- [Love Ya Like a Sister](https://fonts.google.com/specimen/Love+Ya+Like+A+Sister) by [Kimberly Geswein](https://kimberlygeswein.com/)
- [Segoe UI](https://learn.microsoft.com/en-us/typography/font-list/segoe-ui) (for Office logos)
- [Hind](https://fonts.google.com/specimen/Hind) by the [Indian Type Foundry](https://www.indiantypefoundry.com/)
#### Softwares
- [Figma](https://www.figma.com) as the SVG design software
- [Firefox](https://www.mozilla.org/firefox/new/)
- [Gitea](https://about.gitea.com/), an awesome self-hosted github alternative
- [VSCodium](https://vscodium.com/), a community-driven, freely-licensed binary distribution of Microsofts editor VS Code
#### About me
Hi I'm Simon. Computer enthusiast, I have recently switch to become a Product.UX.UI Designer, and used to be a Quality Engineer. I love to create stuff and share it.
[linkedin](https://www.linkedin.com/in/simonpriet/) • [behance](https://www.behance.net/SimonPistache#) • [dribbble](https://dribbble.com/SimonPistache) • [github](https://github.com/SimonPistache)