First of all, thanks for taking the time to contribute! This project can only grow and live by your countless contributions. To keep this project maintainable, we have developed some guidelines for our contributors.
devicon.jsonHere are some terms that we will use in this repo:
svg" refers to the svg versions of the Icons.Here is what you have to do to submit your icons to the repo.
/icons devicon.json to include the new Icon develop branch for each Icon.new icon: Icon name (versions) For the technology name, make the file and folder name lowercase and concatenate them. For example:
angularjs or just angularamazonwebservicesmicrosoftsqlserverEach icon/svg can come in different versions. So far, we have:
Notes
devicon.json so they can be found with either the "original" or "plain" naming convention. Note: this only applies to font icon versions only, not the SVG versions.
Before you submit your logos/svgs, please ensure that they meet the following standard:
(Technology name)-(original|plain|line)(-wordmark?)..svg file contains one version of an icon in a 0 0 128 128 viewbox. You can use a service like resize-image for scaling the svg.svg element does not need the height and width attributes. However, if you do use it, ensure their values are either "128" or "128px". Ex: height="128".svg must use the fill attribute instead of using classes for colors. See here for more details.(Technology name)-(original|plain|line)(-wordmark?).icons folder.eps file.eps file should contains all available versions of an icon. Each version is contained in a 128px by 128px artboard.svg files for the Icondevicon.json
Before you open a PR into Devicon, you must update the devicon.json. This is essential for our build script to work and to document your work.
Here is the object that each of your Icon must have:
{
"name": string, // the official name of the technology. Must be lower case, no space and don't have the dash '-' character.
"tags": string[], // list of tags relating to the technology for search purpose
"versions": {
"svg": VersionString[], // list the svgs that you have
"font": VersionString[] // list the fonts acceptable versions that you have
},
"color": string, // the main color of the logo. Only track 1 color
"aliases": AliasObj[] // keeps track of the aliases for the font versions ONLY
}
Here is what VersionString means:
svg file's nameHere is the AliasObj interface:
{
"base": VersionString, // the base version
"alias": VersionString // the alias version that's similar to the base version
}
As an example, let's assume you have created the svgs for Redhat and Amazon Web Services logos.
For the Redhat svg, you have the "original", "original-wordmark", "plain", and "plain-wordmark" versions.
For the Amazon Web Services svgs, you have the "original", "original-wordmark", "plain-wordmark" versions. The "original" version is simple enough to be a "plain" version as well. Note that we are not using the acronym AWS.
/icons
amazonwebservices and one for redhatdevicon.json
redhat, you would do this
{
"name": "redhat",
"tags": [
"server",
"linux"
],
"versions": {
"svg": [ // here are the versions that are available in svgs
"original",
"original-wordmark",
"plain",
"plain-wordmark"
],
"font": [ // here are the versions that will be used to create icons
"plain",
"plain-wordmark"
]
},
"color": "#e93442", // note the '#' character
"aliases": [] // no aliases in this case
},
amazonwebservices, you would do this
{
"name": "amazonwebservices",
"tags": [
"cloud",
"hosting",
"server"
],
"versions": {
"svg": [ // here are the versions that are available in svgs
"original",
"original-wordmark",
"plain-wordmark"
],
"font": [ // here are the versions that will be used to create icons
"original", // "original" is simple enough to be used as the plain icon so we'll add "plain" to the aliases below
"plain-wordmark",
// note that the alias "plain" is not listed here. It must be listed in the `aliases` attribute
]
},
"color": "#F7A80D", // note the '#' character
"aliases": [
{
"base": "original", // here is the base version that we will upload to Icomoon
"alias": "plain" // this is its alias. Our script will create a reference so users can search using "original" or "plain" for this icon
// note that you don't provide aliases for the svg version. If "original" can't be made into a font, there's no need to provide it with a plain alias
}
]
}
To request an icon, you can create an issue in the repo. Please follow these simple guidelines:
Devicon is living by it's contributors and maintainers. Everyone can and is asked to contribute to this project. You don't have to be in a team to contribute!
The branches master and develop are protected branches and only members
with corresponding permissions (see teams below) are able to push changes to them.
Additional branches must follow the pattern username/feature/description.
The /feature/ indicates that a change is made to existing code (regardless
if it's a fix, refactor or actual feature). The naming convention is based on the gitflow-workflow.
For organisational purposes we introduced teams with permissions and responsibilities:
Write access to the repository (allowing them to create own branches)
and are allowed to push changes to the develop branch (pull request and status checks required).
Maintainer permission
to the repository.
Members of this team are allowed to publish a new release (push master branch after pull
request and status checks).
Wanna join the team? Please open a public discussion where
you introduce yourself.
New member requests have to be approved by all active members of the team Maintainer. Every member
of this team has a veto permission to reject a new member.
To make adding icons easier for repo maintainers, we rely on GitHub Actions, Python, Selenium, and Gulp to automate our tasks.
So far, the tasks in the build script are:
There are also other tasks that we are automating, such as:
We are running a Discord server. You can go here to talk, discuss, and more with the maintainers and other people, too. Here's the invitation: https://discord.gg/hScy8KWACQ. If you don't have a GitHub account but want to suggest ideas or new icons, you can do that here in our Discord channel. Note that the Discord server is unofficial, and Devicons is still being maintained via GitHub.
Devicon does not follow a strict release plan. A new release is depended on current amount of contributions, required bugfixes/patches and will be discussed by the team of maintainers.
Generally speaking: A new release will be published when new icons are added or a bug was fixed. When it's predictable that multiple icons are added in a foreseeable amount of time they are usually wrapped together.
The version naming follows the rules of Semantic Versioning. Given a version number MAJOR.MINOR.PATCH, increment the:
development as draft-release branchnpm version vMAJOR.MINOR.PATCH -m "bump npm version to vMAJOR.MINOR.PATCH" (see #487)draft-releasebuild_icons.yml (which has a workflow_dispatch event trigger) and select the branch draft-release as target branch. This will build a font version of all icons using icomoon and automatically creates a pull request to merge the build result back into draft-releasedevelopment. Mention the release number in the pull request title and add information about all new icons, fixes, features and enhancements in the description of the pull request. Take the commits as a guideline. It's also a good idea to mention and thank all contributions who participated in the release (take description of #504 as an example).master and HEAD development. Copy the description of the earlier pull request.npm publish leading to a updated npm package (vMAJOR.MINOR.PATCH).