Coder Social home page Coder Social logo

tandpfun / skill-icons Goto Github PK

View Code? Open in Web Editor NEW
5.6K 27.0 717.0 1.43 MB

Showcase your skills on your Github readme or resumé with ease ✨

Home Page: https://skillicons.dev

License: MIT License

JavaScript 0.17% SVG 99.83%
icons github-readme github-profile readme-stats

skill-icons's Introduction

Showcase your skills on your GitHub or resumé with ease!


Powered by Cloudflare Workers ⚡

NOTE: To keep icons consistent and to ensure browser support, we don't accept pull requests for icon submissions. If you would like an icon added, please open an issue.

Docs

Example

Specifying Icons

Copy and paste the code block below into your readme to add the skills icon element!

Change the ?i=js,html,css to a list of your skills separated by ","s! You can find a full list of icons here.

[![My Skills](https://skillicons.dev/icons?i=js,html,css,wasm)](https://skillicons.dev)

My Skills

Themed Icons

Some icons have a dark and light themed background. You can specify which theme you want as a url parameter.

This is optional. The default theme is dark.

Change the &theme=light to either dark or light. The theme is the background color, so light theme has a white icon background, and dark has a black-ish.

Light Theme Example:

[![My Skills](https://skillicons.dev/icons?i=java,kotlin,nodejs,figma&theme=light)](https://skillicons.dev)

My Skills

Icons Per Line

You can specify how many icons you would like per line! It's an optional argument, and the default is 15.

Change the &perline=3 to any number between 1 and 50.

[![My Skills](https://skillicons.dev/icons?i=aws,gcp,azure,react,vue,flutter&perline=3)](https://skillicons.dev)

My Skills

Centering Icons

Want to center the icons in your readme? The SVGs are automatically resized, so you can do it the same way you'd normally center an image.

<p align="center">
  <a href="https://skillicons.dev">
    <img src="https://skillicons.dev/icons?i=git,kubernetes,docker,c,vim" />
  </a>
</p>

Icons List

Here's a list of all the icons currently supported. Feel free to open an issue to suggest icons to add!

Icon ID Icon
ableton
activitypub
actix
adonis
ae
aiscript
alpinejs
anaconda
androidstudio
angular
ansible
apollo
apple
appwrite
arch
arduino
astro
atom
au
autocad
aws
azul
azure
babel
bash
bevy
bitbucket
blender
bootstrap
bsd
bun
c
cs
cpp
crystal
cassandra
clion
clojure
cloudflare
cmake
codepen
coffeescript
css
cypress
d3
dart
debian
deno
devto
discord
bots
discordjs
django
docker
dotnet
dynamodb
eclipse
elasticsearch
electron
elixir
elysia
emacs
ember
emotion
express
fastapi
fediverse
figma
firebase
flask
flutter
forth
fortran
gamemakerstudio
gatsby
gcp
git
github
githubactions
gitlab
gmail
gherkin
go
gradle
godot
grafana
graphql
gtk
gulp
haskell
haxe
haxeflixel
heroku
hibernate
html
htmx
idea
ai
instagram
ipfs
java
js
jenkins
jest
jquery
kafka
kali
kotlin
ktor
kubernetes
laravel
latex
less
linkedin
linux
lit
lua
md
mastodon
materialui
matlab
maven
mint
misskey
mongodb
mysql
neovim
nestjs
netlify
nextjs
nginx
nim
nix
nodejs
notion
npm
nuxtjs
obsidian
ocaml
octave
opencv
openshift
openstack
p5js
perl
ps
php
phpstorm
pinia
pkl
plan9
planetscale
pnpm
postgres
postman
powershell
pr
prisma
processing
prometheus
pug
pycharm
py
pytorch
qt
r
rabbitmq
rails
raspberrypi
react
reactivex
redhat
redis
redux
regex
remix
replit
rider
robloxstudio
rocket
rollupjs
ros
ruby
rust
sass
spring
sqlite
stackoverflow
styledcomponents
sublime
supabase
scala
sklearn
selenium
sentry
sequelize
sketchup
solidity
solidjs
svelte
svg
swift
symfony
tailwind
tauri
tensorflow
terraform
threejs
twitter
ts
ubuntu
unity
unreal
v
vala
vercel
vim
visualstudio
vite
vitest
vscode
vscodium
vue
vuetify
wasm
webflow
webpack
webstorm
windicss
windows
wordpress
workers
xd
yarn
yew
zig

💖 Support the Project

Thank you so much already for using my projects! If you want to go a step further and support my open source work, buy me a coffee:

Buy Me a Coffee at ko-fi.com

To support the project directly, feel free to open issues for icon suggestions, or contribute with a pull request!

skill-icons's People

Contributors

danielcshn avatar imgbot[bot] avatar lelouchfr avatar nlepage avatar spectronp avatar tandpfun avatar tetra-fox avatar thatonecalculator avatar warengonzaga avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

skill-icons's Issues

[NEW ICON] Firebase

Skill Name

Firebase

Why?

Popular platform developed by Google for creating web and mobile apps (has things like NoSQL dbs, authentication, etc)

Reference Image

Ref

[NEW ICON] Discord.js

Skill Name

Discord.js

Why?

It is a really popular choice for making discord bots!

Reference Image

djs

[NEW ICON] Visual Studio

Skill Name

Visual Studio

Why?

There is an icon for vscode in the list, then I consider that it will be better with an icon for Visual Studio. Visual Studio is still one of the most powerful IDEs for .NET

Reference Image

Product-Icon

[NEW ICON] Heroku

Skill Name

Heroku

Why?

Heroku is one of the most popular cloud platforms.

Reference Image

heroku-logo-solid-purple

[NEW ICON] Ktor.io

Skill Name

ktor.io

Why?

It's popular among the Kotlin ecosystem to provide a fast, and safe HTTP server/client.

Reference Image

😔 sorry just a base64 blob of it D:

data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDIiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCAxMDIgNDgiPjxnIGZpbGw9Im5vbmUiPjxwYXRoIGZpbGw9IiNGMjY2MzYiIGQ9Ik0xNi4wMDQgMEwwIDE2LjAwNCAxNi4wMDQgMzJWMTYuMDA0SDMyeiIvPjxwYXRoIGZpbGw9IiM2MzczRkYiIGQ9Ik00OCAzMS45OTZMMzEuOTk2IDE2djE1Ljk5NkgxNkwzMS45OTYgNDh6Ii8+PHBhdGggZmlsbD0iIzI3MjgyQyIgZD0iTTMyIDE2SDE2djE2aDE2em0yOS43NTcgMTUuNzd2LTQuNDEybDEuNDYzLTEuNzIgNC4yODcgNi4xMzJoMy43MDRsLTUuNzYtOC4xMTQgNS4zODEtNi4zMjNoLTMuNDM4bC01LjQ1MyA2LjQ4M2gtLjE4NHYtNi40ODNoLTMuMDlWMzEuNzdoMy4wOXptMTEuNzI1LTEzLjY0NnYyLjczaC0xLjc2djIuMjEyaDEuNzZ2NS43MzNjMCAyLjE0IDEuMDg1IDMuMDExIDMuODI3IDMuMDExYTguNSA4LjUgMCAwMDEuNDk0LS4xM3YtMi4xNTFhNy4yIDcuMiAwIDAxLS44OC4wNWMtMS4wMTMgMC0xLjQ2My0uNDYtMS40NjMtMS40NXYtNS4wNjNoMi4zNDN2LTIuMjExSDc2LjQ2di0yLjczMWgtMi45Nzh6TTg2LjIxMSAzMmMzLjQ2OCAwIDUuNTU2LTIuMTQgNS41NTYtNS43NDMgMC0zLjU3MS0yLjExOC01Ljc0Mi01LjU1Ni01Ljc0MnMtNS41NTYgMi4xOC01LjU1NiA1Ljc0MmMwIDMuNTkyIDIuMDg3IDUuNzQzIDUuNTU2IDUuNzQzem0wLTIuMzAxYy0xLjU5NiAwLTIuNDk3LTEuMjYtMi40OTctMy40NDIgMC0yLjE2LjkxLTMuNDMxIDIuNDk3LTMuNDMxIDEuNTc1IDAgMi40OTYgMS4yNyAyLjQ5NiAzLjQzMSAwIDIuMTgxLS45MSAzLjQ0Mi0yLjQ5NiAzLjQ0MnptNy45OSAyLjA3aDIuOTc4di02LjE2MmMwLTEuNTUgMS4xMTUtMi41MDEgMi43NDItMi41MDEuNDgxIDAgMS4xNzcuMDggMS40MTIuMTZ2LTIuNTYxYy0uMjU1LS4wOC0uNzU3LS4xMy0xLjE2Ni0uMTMtMS40MzIgMC0yLjU5OS44My0yLjg5NiAxLjkzaC0uMTg0di0xLjc1aC0yLjg4NVYzMS43N3oiLz48L2c+PC9zdmc+Cg==

[NEW ICON] Amazon DynamoDB

Skill Name

DynamoDB

Why?

Because it is very popular among developers who use AWS services

Reference Image

dynamo

[NEW ICON] Light theme for Remix icon

Skill Name

Remix

Why?

I know there already is an icon for Remix, but there is no light version because the proposer thought Remix didn't like their brand colors changed but Remix team has already made their logos folder public and in there, there are light logos of Remix, so I think a light version can be added. Here's the google drive folder of remix logos made public by their team.

Reference Image

https://drive.google.com/drive/u/0/folders/1pbHnJqg8Y1ATs0Oi8gARH7wccJGv4I2c

[NEW ICONS] [COMPLETED 🥳] Perl, Julia, Astro

Skill Name

Perl, Julia, Astro

Why?

  • Perl: very popular programming language
  • Julia very popular programming language
  • Astro: very popular web framework

Completed icons

Light for Light/Dark

Perl

Perl-Light

Julia

Julia-Light

Colored background

Astro

Astro

[NEW ICON] Ubuntu

Skill Name

Ubuntu

Why?

Well, it is a popular Linux distribution for developers.

Reference Image

No response

[NEW ICON] NestJS

Skill Name

NestJS

Why?

Skill Name
NestJS

Why?
NestJS is a popular back-end framework

Reference Images (optional)
Example.

Reference Image

No response

[NEW ICON] Appwrite

Skill Name

Appwrite

Why?

Appwrite is slowly becoming more and more popular backend as a service, similar to Firebase. Since Firebase is already on the list, I believe experience with a BaaS is a skill. Considering Appwite is open source, just like Skill Icons, I think adding Appwrite into the skills icons list would be a great addition.

Reference Image

https://appwrite.io/assets

I can create a PR, but as non-designer I would love some feedback on the structure. Icons I have ready are:

CleanShot 2022-03-13 at 08 26 01@2x

Opened questions:

  • Which row should the icon use? First would be same for dark&light, second is using Skill Icons dark&light background, and third is using Appwrite color pallete only
  • Is padding between icon and background correct? The square is 256x256, and the icon is 193x129.

[NEW ICONS] [ALREADY MADE] V, LaTeX, .NET, Vala

Skill Name

TeX, Vala, .NET, V

Why?

  • LaTeX: most popular document language, if markdown is here then TeX/LaTeX should be for sure
  • .NET: very popular programing language
  • V: popular programming language
  • Vala: popular programming language

Completed icons

V-Light V-Dark

LaTeX-Light LaTeX-Dark

DotNet

Vala

[NEW ICON] PowerShell

Skill Name

PowerShell

Why?

Similar to Bash, PowerShell is simple, yet powerful scripting language from Microsoft primarily for automation of tedious and repetitive tasks to run, build, and test systems and servers via the .NET ecosystem.

Reference Image

[NEW ICON] [COMPLETED 🥳] Fediverse, Mastodon, Misskey

Skill Name

Fediverse, Mastodon, Misskey

Why?

Since social icons are starting to be added, it would be a good idea to include the Fediverse. Mastodon and Misskey are by far the two most popular Fediverse services, and the Fediverse logo encompasses the rest of Fediverse servicess (Pixelfed, Pleroma, Hometown, etc)

Reference Image

Fediverse

Fediverse-Light

Mastodon

Mastodon-Light

Misskey

Misskey-Light

[NEW ICON] Stack Overflow

Skill Name

Stack Overflow

Why?

Without stack overflow, the internet simply wouldn't exist.

Reference Image

<svg width="32" height="37" viewBox="0 0 32 37"><path d="M26 33v-9h4v13H0V24h4v9h22Z" fill="#BCBBBB"></path><path d="m21.5 0-2.7 2 9.9 13.3 2.7-2L21.5 0ZM26 18.4 13.3 7.8l2.1-2.5 12.7 10.6-2.1 2.5ZM9.1 15.2l15 7 1.4-3-15-7-1.4 3Zm14 10.79.68-2.95-16.1-3.35L7 23l16.1 2.99ZM23 30H7v-3h16v3Z" fill="#F48024"></path></svg>

Stolen from https://stackoverflow.design/product/resources/icons/#logoglyphmd

[NEW ICON] Discord

Skill Name
Discord

Why?
Popular chat platform, would be good to add into 'social' parts of GH readmes

Reference Images (optional)
Ref

[NEW ICON] Networking Icon

Skill Name

Networking

Why?

People who are experienced in networking might want to display their networking skills with a skill icon.

Reference Image

I'd imagine an ethernet port for the icon, I can't design icons so I don't have one to upload.

[NEW ICON] Windows/MacOS

Skill Name

Windows/MacOS

Why?

This repository already has Linux Icon, I think Windows and MacOS Icons will be useful.

Reference Image

[NEW ICON] Supabase

Skill Name

Supabase

Why?

It's an open-source alternative to firebase

Reference Image

supabase-logo-icon

[NEW ICON] OpenShift

Skill Name
OpenShift

Why?
Popular enterprise-ready Kubernetes container platform

Reference Image
in attachment

Product_Icon-Red_Hat-OpenShift-RGB-256
Product_Icon-Red_Hat-OpenShift-RGB-38

[NEW ICONS] [COMPLETED 🥳] Nim, Laravel, AutoCAD, Blender, Unreal Engine, HaxeFlixel, ActivityPub, GameMaker Studio, AiScript, EMACS

Skill Names

  • Nim
  • Laravel
  • AutoCAD
  • Blender
  • Unreal Engine (ue)
  • HaxeFlixel
  • ActivityPub
  • GameMaker Studio (gamemaker)
  • AiScript
  • EMACS

Why?

  • Nim: It's a very popular programming language
  • Laravel: Most popular PHP framework (basically the React of PHP)
  • AutoCAD: most popular CAD (Computer assisted design) software, if the Adobe suite is included, AutoCAD makes sense too.
  • Blender: Same as AutoCAD but for 3D work, Blender also incorporates a lot of coding
  • Unreal Engine: very popular game engine, fits in with Unity and Godot
  • HaxeFlixel: most popular Haxe graphics library, very very widely used in the FNF community
  • ActivityPub: Defacto standard for federated, decentralized communication, powers the Fediverse and is a very useful and powerful programming skill
  • GameMaker Studio: very popular pickup-and-play game engine and scripting language.
  • AiScript: built in programming language of Misskey, and also acts as a standalone scripting language, more popular in Japan than anywhere else as it was developed specifically for Japanese programmers.
  • EMACS: very popular coding environment and programming language

Reference Image

I'll probably make an icons in the morning, this issue is mostly a reminder to myself.

https://github.com/nim-lang/assets/tree/master/Art

https://laravel.com/img/logomark.min.svg

https://upload.wikimedia.org/wikipedia/commons/0/08/AutoCad_logo.svg

https://upload.wikimedia.org/wikipedia/commons/3/3c/Logo_Blender.svg

https://upload.wikimedia.org/wikipedia/commons/d/da/Unreal_Engine_Logo.svg

https://haxeflixel.com/images/haxeflixel.svg

https://www.vectorlogo.zone/logos/w3_activitypub/w3_activitypub-icon.svg

https://upload.wikimedia.org/wikipedia/en/7/7a/GameMaker_Studio_2.svg

https://github.com/syuilo/aiscript/raw/master/aiscript.svg

https://upload.wikimedia.org/wikipedia/commons/0/08/EmacsIcon.svg

[NEW ICONS] [ALREADY MADE 🥳] BSD, Plan9

Skill Name

BSD, Plan9

Why?

BSD and Plan9 is are popular Unix-like, non-Linux OSes used for development and servers.

Completed icons

I actually made the Glenda (Plan9) svg myself, because the official Plan9 logo is a .jpg
I'm unsure if the SVG needs to me fixed in any way.

BSD-Light BSD-Dark

Plan9-Light Plan9-Dark

[NEW ICON] Spring Flutter Bootstrap Express AWS GCP Azure IntelliJ Idea Eclipse

Skill Name

Spring Flutter Bootstrap Express AWS GCP Azure

Why?

Spring boot is one of the most used web frameworks for Java
Flutter is the best cross-platform development framework.
Bootstrap is popular HTML framework
Express is the most used Nodejs library for creating an HTTP server
AWS, GCP, Azure - biggest cloud providers
IntelliJ Idea, Eclipse most used IDEs by Java devs

Reference Image

No response

[FEATURE REQUEST] ImgBot

Feature requested

By adding ImgBot, you could reduce the overall filesize of the SVGs which could lighten the amount of data anyone loads when they view the SVGs

[NEW ICONS] [COMPLETED 🥳] Apollo, Gherkin, Rocket, Fortran

Skill Name

Apollo, Gherkin, Rocket, Fortran

Why?

Apollo: very popular GraphQL client/framework
Rocket: very popular Rust web framework
Gherkin: popular templating language
Fortran: some of us boomers still exist (actually still widely used in legacy programs)

Completed icons

Apollo
Rocket
Gherkin-Light
Fortran

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.