git404hub

what is tabler-icons fr?

tabler/tabler-icons — explained in plain English

Analysis updated 2026-06-21

★ 20,672JavaScriptAudience · designerComplexity · 1/5LicenseSetup · easy

tl;dr

Tabler Icons is a free MIT-licensed set of over 6,000 consistently styled SVG icons you can drop into any web project, with ready-made components for React, Vue, Angular, and Svelte and a CDN option for projects without a bundler.

vibe map

mindmap
  root((Tabler Icons))
    What it does
      6000 plus SVG icons
      Consistent visual style
      Multi-framework support
    Tech Stack
      SVG source files
      React package
      Vue package
      Angular Svelte
    Use Cases
      Web app icons
      Design systems
      CSS icon font
    Distribution
      npm packages
      CDN jsDelivr
      Direct SVG download

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

what do people make with this?

VIBE 1

Add a large consistent icon set to a React, Vue, or Angular app by importing named components like IconHome or IconHeart from the matching package.

VIBE 2

Drop SVG icon files directly into a website as image tags or inline SVG so CSS can control their color and size.

VIBE 3

Use the @tabler/icons-webfont package to display icons as a CSS icon font in a project that has no JavaScript bundler.

VIBE 4

Pick a matching visual icon set for a design system from 6,000+ options and install only the packages for the frameworks you use.

what's the stack?

JavaScriptTypeScriptReactVueAngularSvelteSVG

how it stacks up fr

tabler/tabler-iconschokcoco/icsssortablejs/vue.draggable
Stars20,67220,71220,612
LanguageJavaScriptJavaScriptJavaScript
Setup difficultyeasyeasyeasy
Complexity1/51/52/5
Audiencedesignerdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

how do i run it?

Difficulty · easy time til it works · 5min
Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

in plain english

Tabler Icons is a free, MIT-licensed library of more than 6,000 SVG icons (vector graphics that stay crisp at any size) that you can drop into web projects. The README pegs the current count at 6,110: 5,057 outline icons plus 1,053 filled icons. Each icon is drawn on a 24-by-24 grid with a 2-pixel stroke, which means they share a consistent visual weight when used together in an interface. Because every icon is an SVG, the same source file can be used in several ways. You can reference it as the source of an HTML image tag, paste the SVG markup directly into your page (inline) so CSS can change its color and stroke width, or pull individual icons from an SVG sprite using a fragment identifier. There are also wrapper packages for the most common front-end frameworks: React (via @tabler/icons-react), Vue (@tabler/icons-vue), Angular (angular-tabler-icons), and Svelte (with separate packages for Svelte 4 and the newer Svelte 5 runes flavor). Each wrapper exposes the icons as components you can import by name, like IconHome or IconHeart, and lets you set size, color, and stroke width as props. TypeScript declarations are included for the React, Vue and Angular packages. You install the base package from npm as @tabler/icons, or just download a release from GitHub. There is also a CDN distribution served through jsDelivr, including a webfont version (@tabler/icons-webfont) that exposes the icons as a CSS icon font for use without a bundler. You would reach for it whenever you are building a website, web application, or design system and want a large, visually consistent icon set without paying licensing fees.

prompts (copy fr)

prompt 1
Using @tabler/icons-react in a React app, import the IconSearch, IconHeart, and IconUser icons and render them with a custom color and size using props.
prompt 2
I'm building a Vue 3 app. Show me how to install @tabler/icons-vue and display a navigation bar with five Tabler icons, with the active icon highlighted in blue.
prompt 3
How do I use Tabler Icons in a plain HTML page without a bundler, using the jsDelivr CDN and inline SVG markup?
prompt 4
I want to add Tabler Icons to an Angular project. Walk me through installing angular-tabler-icons and registering the icons I need as a module.
prompt 5
How do I change the stroke width and size of a Tabler icon inside a Svelte 5 runes component?

Frequently asked questions

what is tabler-icons fr?

Tabler Icons is a free MIT-licensed set of over 6,000 consistently styled SVG icons you can drop into any web project, with ready-made components for React, Vue, Angular, and Svelte and a CDN option for projects without a bundler.

What language is tabler-icons written in?

Mainly JavaScript. The stack also includes JavaScript, TypeScript, React.

What license does tabler-icons use?

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

How hard is tabler-icons to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is tabler-icons for?

Mainly designer.

peek the repo → explain another one

This repo across BitVibe Labs

double-check against the repo, no cap.

similar repos, if this ain't it