1.0.2 • Published 2 years ago

react-skillicons v1.0.2

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

React-Skillicons

Use Skill Icons by tandpfun in React!

MIT License

My Skills

Installation

Install with npm

  npm install react-skillicons

Usage/Examples

import React from "react";
import { Github_Dark, JavaScript, React_Dark } from "react-skillicons";
// Add other icons here

function App() {
  return (
    <div>
      <Github_Dark />
      <JavaScript />
      <React_Dark className="icon" />
    </div>
  );
}

export default App;

Available Icons

To see all Icons visit skillicons.dev

Icon NameUsage
AWS_Dark<AWS_Dark />
AWS_Light<AWS_Light />
Ableton_Dark<Ableton_Dark />
Ableton_Light<Ableton_Light />
ActivityPub_Dark<ActivityPub_Dark />
ActivityPub_Light<ActivityPub_Light />
Actix_Dark<Actix_Dark />
Actix_Light<Actix_Light />
Adonis<Adonis />
AfterEffects<AfterEffects />
AiScript_Dark<AiScript_Dark />
AiScript_Light<AiScript_Light />
AlpineJS_Dark<AlpineJS_Dark />
AlpineJS_Light<AlpineJS_Light />
AndroidStudio_Dark<AndroidStudio_Dark />
AndroidStudio_Light<AndroidStudio_Light />
Angular_Dark<Angular_Dark />
Angular_Light<Angular_Light />
Ansible<Ansible />
Apollo<Apollo />
Appwrite<Appwrite />
Arduino<Arduino />
Astro<Astro />
Atom<Atom />
Audition<Audition />
AutoCAD_Dark<AutoCAD_Dark />
AutoCAD_Light<AutoCAD_Light />
Azul<Azul />
Azure_Dark<Azure_Dark />
Azure_Light<Azure_Light />
BSD_Dark<BSD_Dark />
BSD_Light<BSD_Light />
Babel<Babel />
Bash_Dark<Bash_Dark />
Bash_Light<Bash_Light />
Bevy_Dark<Bevy_Dark />
Bevy_Light<Bevy_Light />
Blender_Dark<Blender_Dark />
Blender_Light<Blender_Light />
Bootstrap<Bootstrap />
C<C />
CMake_Dark<CMake_Dark />
CMake_Light<CMake_Light />
CPP<CPP />
CS<CS />
CSS<CSS />
Cassandra_Dark<Cassandra_Dark />
Cassandra_Light<Cassandra_Light />
Clojure_Dark<Clojure_Dark />
Clojure_Light<Clojure_Light />
Cloudflare_Dark<Cloudflare_Dark />
Cloudflare_Light<Cloudflare_Light />
CodePen_Dark<CodePen_Dark />
CodePen_Light<CodePen_Light />
CoffeeScript_Dark<CoffeeScript_Dark />
CoffeeScript_Light<CoffeeScript_Light />
Crystal_Dark<Crystal_Dark />
Crystal_Light<Crystal_Light />
D3_Dark<D3_Dark />
D3_Light<D3_Light />
DENO_Dark<DENO_Dark />
DENO_Light<DENO_Light />
Dart_Dark<Dart_Dark />
Dart_Light<Dart_Light />
DevTo_Dark<DevTo_Dark />
DevTo_Light<DevTo_Light />
Discord<Discord />
DiscordBots<DiscordBots />
Django<Django />
Docker<Docker />
DotNet<DotNet />
DynamoDB_Dark<DynamoDB_Dark />
DynamoDB_Light<DynamoDB_Light />
Eclipse_Dark<Eclipse_Dark />
Eclipse_Light<Eclipse_Light />
Electron<Electron />
Elixir_Dark<Elixir_Dark />
Elixir_Light<Elixir_Light />
Emacs<Emacs />
Ember<Ember />
Emotion_Dark<Emotion_Dark />
Emotion_Light<Emotion_Light />
ExpressJS_Dark<ExpressJS_Dark />
ExpressJS_Light<ExpressJS_Light />
FastAPI<FastAPI />
Fediverse_Dark<Fediverse_Dark />
Fediverse_Light<Fediverse_Light />
Figma_Dark<Figma_Dark />
Figma_Light<Figma_Light />
Firebase_Dark<Firebase_Dark />
Firebase_Light<Firebase_Light />
Flask_Dark<Flask_Dark />
Flask_Light<Flask_Light />
Flutter_Dark<Flutter_Dark />
Flutter_Light<Flutter_Light />
Forth<Forth />
Fortran<Fortran />
GCP_Dark<GCP_Dark />
GCP_Light<GCP_Light />
GTK_Dark<GTK_Dark />
GTK_Light<GTK_Light />
GameMakerStudio<GameMakerStudio />
Gatsby<Gatsby />
Gherkin_Dark<Gherkin_Dark />
Gherkin_Light<Gherkin_Light />
Git<Git />
GitLab_Dark<GitLab_Dark />
GitLab_Light<GitLab_Light />
GithubActions_Dark<GithubActions_Dark />
GithubActions_Light<GithubActions_Light />
Github_Dark<Github_Dark />
Github_Light<Github_Light />
GoLang<GoLang />
Godot_Dark<Godot_Dark />
Godot_Light<Godot_Light />
Gradle_Dark<Gradle_Dark />
Gradle_Light<Gradle_Light />
Grafana_Dark<Grafana_Dark />
Grafana_Light<Grafana_Light />
GraphQL_Dark<GraphQL_Dark />
GraphQL_Light<GraphQL_Light />
Gulp<Gulp />
HTML<HTML />
Haskell_Dark<Haskell_Dark />
Haskell_Light<Haskell_Light />
HaxeFlixel_Dark<HaxeFlixel_Dark />
HaxeFlixel_Light<HaxeFlixel_Light />
Haxe_Dark<Haxe_Dark />
Haxe_Light<Haxe_Light />
Heroku<Heroku />
Hibernate_Dark<Hibernate_Dark />
Hibernate_Light<Hibernate_Light />
IPFS_Dark<IPFS_Dark />
IPFS_Light<IPFS_Light />
Idea_Dark<Idea_Dark />
Idea_Light<Idea_Light />
Illustrator<Illustrator />
Instagram<Instagram />
JQuery<JQuery />
JavaScript<JavaScript />
Java_Dark<Java_Dark />
Java_Light<Java_Light />
Jenkins_Dark<Jenkins_Dark />
Jenkins_Light<Jenkins_Light />
Jest<Jest />
Julia_Dark<Julia_Dark />
Julia_Light<Julia_Light />
Kafka<Kafka />
Kotlin_Dark<Kotlin_Dark />
Kotlin_Light<Kotlin_Light />
Ktor_Dark<Ktor_Dark />
Ktor_Light<Ktor_Light />
Kubernetes<Kubernetes />
LaTeX_Dark<LaTeX_Dark />
LaTeX_Light<LaTeX_Light />
Laravel_Dark<Laravel_Dark />
Laravel_Light<Laravel_Light />
LinkedIn<LinkedIn />
Linux_Dark<Linux_Dark />
Linux_Light<Linux_Light />
Lit_Dark<Lit_Dark />
Lit_Light<Lit_Light />
Lua_Dark<Lua_Dark />
Lua_Light<Lua_Light />
Markdown_Dark<Markdown_Dark />
Markdown_Light<Markdown_Light />
Mastodon_Dark<Mastodon_Dark />
Mastodon_Light<Mastodon_Light />
MaterialUI_Dark<MaterialUI_Dark />
MaterialUI_Light<MaterialUI_Light />
Matlab_Dark<Matlab_Dark />
Matlab_Light<Matlab_Light />
Maven_Dark<Maven_Dark />
Maven_Light<Maven_Light />
Misskey_Dark<Misskey_Dark />
Misskey_Light<Misskey_Light />
MongoDB<MongoDB />
MySQL_Dark<MySQL_Dark />
MySQL_Light<MySQL_Light />
NeoVim_Dark<NeoVim_Dark />
NeoVim_Light<NeoVim_Light />
NestJS_Dark<NestJS_Dark />
NestJS_Light<NestJS_Light />
Netlify_Dark<Netlify_Dark />
Netlify_Light<Netlify_Light />
NextJS_Dark<NextJS_Dark />
NextJS_Light<NextJS_Light />
Nginx<Nginx />
Nim_Dark<Nim_Dark />
Nim_Light<Nim_Light />
NodeJS_Dark<NodeJS_Dark />
NodeJS_Light<NodeJS_Light />
NuxtJS_Dark<NuxtJS_Dark />
NuxtJS_Light<NuxtJS_Light />
OCaml<OCaml />
Octave_Dark<Octave_Dark />
Octave_Light<Octave_Light />
OpenShift<OpenShift />
OpenStack_Dark<OpenStack_Dark />
OpenStack_Light<OpenStack_Light />
PHP_Dark<PHP_Dark />
PHP_Light<PHP_Light />
Perl<Perl />
Photoshop<Photoshop />
Plan9_Dark<Plan9_Dark />
Plan9_Light<Plan9_Light />
PlanetScale_Dark<PlanetScale_Dark />
PlanetScale_Light<PlanetScale_Light />
PostgreSQL_Dark<PostgreSQL_Dark />
PostgreSQL_Light<PostgreSQL_Light />
Postman<Postman />
Powershell_Dark<Powershell_Dark />
Powershell_Light<Powershell_Light />
Premiere<Premiere />
Prisma<Prisma />
Processing_Dark<Processing_Dark />
Processing_Light<Processing_Light />
Prometheus<Prometheus />
Pug_Dark<Pug_Dark />
Pug_Light<Pug_Light />
PyTorch_Dark<PyTorch_Dark />
PyTorch_Light<PyTorch_Light />
Python_Dark<Python_Dark />
Python_Light<Python_Light />
QT_Dark<QT_Dark />
QT_Light<QT_Light />
ROS_Dark<ROS_Dark />
ROS_Light<ROS_Light />
R_Dark<R_Dark />
R_Light<R_Light />
RabbitMQ_Dark<RabbitMQ_Dark />
RabbitMQ_Light<RabbitMQ_Light />
Rails<Rails />
RaspberryPi_Dark<RaspberryPi_Dark />
RaspberryPi_Light<RaspberryPi_Light />
React_Dark<React_Dark />
React_Light<React_Light />
ReactiveX_Dark<ReactiveX_Dark />
ReactiveX_Light<ReactiveX_Light />
Redis_Dark<Redis_Dark />
Redis_Light<Redis_Light />
Redux<Redux />
Regex_Dark<Regex_Dark />
Regex_Light<Regex_Light />
Remix_Dark<Remix_Dark />
Remix_Light<Remix_Light />
Replit_Dark<Replit_Dark />
Replit_Light<Replit_Light />
Rocket<Rocket />
RollupJS_Dark<RollupJS_Dark />
RollupJS_Light<RollupJS_Light />
Ruby<Ruby />
Rust<Rust />
SQLite<SQLite />
SVG_Dark<SVG_Dark />
SVG_Light<SVG_Light />
Sass<Sass />
Scala_Dark<Scala_Dark />
Scala_Light<Scala_Light />
Selenium<Selenium />
Sentry<Sentry />
Sequelize_Dark<Sequelize_Dark />
Sequelize_Light<Sequelize_Light />
Sketchup_Dark<Sketchup_Dark />
Sketchup_Light<Sketchup_Light />
SolidJS_Dark<SolidJS_Dark />
SolidJS_Light<SolidJS_Light />
Solidity<Solidity />
Spring_Dark<Spring_Dark />
Spring_Light<Spring_Light />
StackOverflow_Dark<StackOverflow_Dark />
StackOverflow_Light<StackOverflow_Light />
StyledComponents<StyledComponents />
Supabase_Dark<Supabase_Dark />
Supabase_Light<Supabase_Light />
Svelte<Svelte />
Swift<Swift />
Symfony_Dark<Symfony_Dark />
Symfony_Light<Symfony_Light />
TailwindCSS_Dark<TailwindCSS_Dark />
TailwindCSS_Light<TailwindCSS_Light />
Tauri_Dark<Tauri_Dark />
Tauri_Light<Tauri_Light />
TensorFlow_Dark<TensorFlow_Dark />
TensorFlow_Light<TensorFlow_Light />
ThreeJS_Dark<ThreeJS_Dark />
ThreeJS_Light<ThreeJS_Light />
Twitter<Twitter />
TypeScript<TypeScript />
Unity_Dark<Unity_Dark />
Unity_Light<Unity_Light />
UnrealEngine<UnrealEngine />
VIM_Dark<VIM_Dark />
VIM_Light<VIM_Light />
VSCode_Dark<VSCode_Dark />
VSCode_Light<VSCode_Light />
V_Dark<V_Dark />
V_Light<V_Light />
Vala<Vala />
Vercel_Dark<Vercel_Dark />
Vercel_Light<Vercel_Light />
VisualStudio_Dark<VisualStudio_Dark />
VisualStudio_Light<VisualStudio_Light />
Vite_Dark<Vite_Dark />
Vite_Light<Vite_Light />
VueJS_Dark<VueJS_Dark />
VueJS_Light<VueJS_Light />
WebAssembly<WebAssembly />
Webflow<Webflow />
Webpack_Dark<Webpack_Dark />
Webpack_Light<Webpack_Light />
WindiCSS_Dark<WindiCSS_Dark />
WindiCSS_Light<WindiCSS_Light />
Wordpress<Wordpress />
Workers_Dark<Workers_Dark />
Workers_Light<Workers_Light />
XD<XD />
Zig_Dark<Zig_Dark />
Zig_Light<Zig_Light />

Props

className: Apply custom CSS classes for styling the icons.

<Github_Dark className="icon">

Related

Here is the original author of Skill Icons

Tandpfun