SuperTinyIcons
Under 1KB each! Super Tiny Icons are miniscule SVG versions of your favourite website and app logos
Top Related Projects
SVG icons for popular brands
The iconic SVG, font, and CSS toolkit
A scalable set of icons handcrafted with <3 by GitHub
Official open source SVG icon library for Bootstrap.
Simply beautiful open-source icons
Premium hand-crafted icons built by Ionic, for Ionic apps and web apps everywhere 🌎
Quick Overview
SuperTinyIcons is a collection of ultra-small, minified SVG icons for popular websites, apps, and brands. These icons are designed to be as small as possible while maintaining recognizability, making them ideal for use in projects where file size is a critical concern.
Pros
- Extremely small file sizes, often under 1KB each
- Wide variety of popular brand and website icons
- SVG format ensures scalability without loss of quality
- Easy to customize and integrate into web projects
Cons
- Limited to brand and website icons, not suitable for general-purpose iconography
- Some icons may lack detail due to extreme minimization
- Not all brands or websites are represented
- Manual integration required; no package manager support
Getting Started
To use SuperTinyIcons in your project:
- Visit the SuperTinyIcons GitHub repository.
- Navigate to the
images
folder. - Download the desired SVG icon(s).
- Include the SVG in your HTML:
<img src="path/to/icon.svg" alt="Icon Name" width="32" height="32">
Or inline the SVG directly in your HTML:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<!-- SVG content here -->
</svg>
You can also use the icons as background images in CSS:
.icon {
background-image: url('path/to/icon.svg');
background-size: contain;
width: 32px;
height: 32px;
}
Competitor Comparisons
SVG icons for popular brands
Pros of Simple Icons
- Larger collection with over 2,000 brand icons
- Consistent 24x24 pixel size for all icons
- Available in multiple formats (SVG, PNG, EPS)
Cons of Simple Icons
- Larger file sizes compared to SuperTinyIcons
- Less focus on extreme minimalism and file size optimization
- May require more bandwidth for loading multiple icons
Code Comparison
SuperTinyIcons SVG example:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="#1da1f2" d="M459 152l1 13c0 139-106 299-299 299-59 0-115-17-161-47a217 217 0 0 0 156-44c-47-1-85-31-98-72l19 1c10 0 19-1 28-3-48-10-84-52-84-103v-2c14 8 30 13 47 14A105 105 0 0 1 36 67c51 64 129 106 216 110-2-8-2-16-2-24a105 105 0 0 1 181-72c24-4 47-13 67-25-8 24-25 45-46 58 21-3 41-8 60-17-14 21-32 40-53 55z"/>
</svg>
Simple Icons SVG example:
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<title>Twitter</title>
<path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>
</svg>
The iconic SVG, font, and CSS toolkit
Pros of Font-Awesome
- Extensive icon library with thousands of options
- Regular updates and additions to the icon set
- Supports multiple file formats (SVG, webfonts, etc.)
Cons of Font-Awesome
- Larger file size, potentially impacting page load times
- More complex implementation, especially for beginners
- Some features require a paid subscription
Code Comparison
SuperTinyIcons:
<img src="https://github.com/edent/SuperTinyIcons/raw/master/images/svg/github.svg" width="32" height="32" alt="GitHub">
Font-Awesome:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<i class="fab fa-github"></i>
SuperTinyIcons focuses on providing ultra-small SVG icons, typically under 1KB each. This approach results in faster load times and simpler implementation. However, the icon selection is more limited compared to Font-Awesome.
Font-Awesome offers a vast library of icons with regular updates and multiple file format options. It provides more flexibility in terms of styling and customization. However, this comes at the cost of larger file sizes and a steeper learning curve for implementation.
The code comparison shows that SuperTinyIcons can be easily implemented using a standard <img>
tag, while Font-Awesome requires linking to an external stylesheet and using specific classes for icon display.
A scalable set of icons handcrafted with <3 by GitHub
Pros of Octicons
- Larger, more comprehensive set of icons (200+)
- Official GitHub design system, ensuring consistency with GitHub's UI
- Multiple file formats available (SVG, PNG, AI)
Cons of Octicons
- Larger file sizes, potentially impacting load times
- More complex implementation due to multiple formats and options
- Specific to GitHub's design language, may not fit all projects
Code Comparison
SuperTinyIcons:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="#1da1f2" d="M512 97c-19 8-39 14-60 16 22-13 38-34 46-58-20 12-43 21-67 25-19-20-46-32-76-32-58 0-117 52-102 129-87-4-165-46-216-110-24 40-19 107 32 140-17 0-33-5-47-13v1c0 51 36 93 84 103-15 4-31 5-47 2 13 42 52 72 98 73-47 36-96 49-155 44 46 30 102 47 161 47 197 0 306-168 299-312 20-15 38-34 52-55z"/>
</svg>
Octicons:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16">
<path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path>
</svg>
Official open source SVG icon library for Bootstrap.
Pros of Icons
- Larger collection with over 1,800 icons
- Maintained by the Bootstrap team, ensuring consistency with the Bootstrap framework
- Includes both SVG and web font versions for flexibility
Cons of Icons
- Larger file sizes due to the comprehensive collection
- May require more effort to customize or modify individual icons
- Higher complexity in implementation, especially when using the full set
Code Comparison
SuperTinyIcons:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="#1da1f2" d="M459 152l1 13c0 139-106 299-299 299-59 0-115-17-161-47a217 217 0 0 0 156-44c-47-1-85-31-98-72l19 1c10 0 19-1 28-3-48-10-84-52-84-103v-2c14 8 30 13 47 14A105 105 0 0 1 36 67c51 64 129 106 216 110-2-8-2-16-2-24a105 105 0 0 1 181-72c24-4 47-13 67-25-8 24-25 45-46 58 21-3 41-8 60-17-14 21-32 40-53 55z"/>
</svg>
Icons:
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-twitter" viewBox="0 0 16 16">
<path d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"/>
</svg>
Simply beautiful open-source icons
Pros of Feather
- Larger icon set with over 280 icons, offering more variety
- Consistent design style across all icons, ensuring a cohesive look
- Available in multiple formats (SVG, React, Vue, etc.) for easy integration
Cons of Feather
- Larger file sizes compared to SuperTinyIcons
- Less emphasis on extreme minimalism and file size optimization
- May require more customization for specific use cases
Code Comparison
SuperTinyIcons:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path fill="#1da1f2" d="M512 97c-19 8-39 14-60 16 22-13 38-34 46-58-20 12-43 21-67 25-19-20-46-32-76-32-58 0-117 52-102 129-87-4-165-46-216-110-24 40-19 107 32 140-17 0-33-5-47-13v1c0 51 36 93 84 103-15 4-34 5-47 2 13 42 52 72 98 73-47 36-96 49-155 44 49 32 108 50 168 50 181 0 285-147 280-278 20-14 37-32 51-52z"/>
</svg>
Feather:
import React from 'react'
import { Twitter } from 'react-feather'
const TwitterIcon = () => {
return <Twitter />
}
export default TwitterIcon
SuperTinyIcons focuses on minimal SVG code for extremely small file sizes, while Feather provides a more flexible and developer-friendly approach with various implementation options.
Premium hand-crafted icons built by Ionic, for Ionic apps and web apps everywhere 🌎
Pros of Ionicons
- Larger icon set with over 1,300 icons, offering more variety
- Designed specifically for use with Ionic Framework, ensuring seamless integration
- Supports multiple file formats (SVG, WebFont, PNG) for flexibility in different use cases
Cons of Ionicons
- Larger file sizes, potentially impacting load times and performance
- More complex implementation, especially for non-Ionic projects
- Regular updates may require maintenance to keep icons current
Code Comparison
SuperTinyIcons:
<svg xmlns="http://www.w3.org/2000/svg" aria-label="GitHub" role="img" viewBox="0 0 512 512">
<rect width="512" height="512" rx="15%" fill="#181717"/>
<path fill="#fff" d="M335 499c14 0 12 17 12 17H165s-2-17 12-17c13 0 16-6 16-12l-1-44c-71 16-86-28-86-28-12-30-28-37-28-37-24-16 1-16 1-16 26 2 40 26 40 26 22 39 59 28 74 22 2-17 9-28 16-35-57-6-116-28-116-126 0-28 10-51 26-69-3-6-11-32 3-67 0 0 21-7 70 26 42-12 86-12 128 0 49-33 70-26 70-26 14 35 6 61 3 67 16 18 26 41 26 69 0 98-60 120-117 126 10 8 18 24 18 48l-1 70c0 6 3 12 16 12z"/>
</svg>
Ionicons:
<ion-icon name="logo-github"></ion-icon>
SuperTinyIcons focuses on minimal, lightweight SVG icons, while Ionicons provides a more comprehensive icon library with easier implementation for Ionic projects. SuperTinyIcons requires more manual HTML, but offers greater control over the icon's appearance. Ionicons simplifies usage with a custom element, but may have more overhead for non-Ionic projects.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
Super Tiny Icons
Under 1KB each! Super Tiny Web Icons are minuscule SVG versions of your favourite logos. There are currently 423 icons and the average size is under 529 bytes!
The logos have a 512x512 viewbox, they will fit in a circle with radius 256. They will scale up and down to suit your needs.
How Small?
527 Bytes SVG | 3,328 Bytes PNG | 352 Bytes SVG | 2,987 Bytes PNG | 235 Bytes SVG | 1,615 Bytes PNG |
---|---|---|---|---|---|
![]() | ![]() | ![]() |
Hacktoberfest!
This project welcomes Hacktoberfest participants. All we ask is that you:
- â Make your logo under 1,024 bytes.
- â Follow the Contributing Guidance.
- â Be friendly to other participants.
- â Choose a logo which is highly recognisable.
- â Don't use AI. That means no ChatGPT, Gemini, Claude, etc. This is your opportunity to learn.
- â Don't change the HTML
- â Don't send broken logos
- â Don't ignore the guidelines
If you do not follow the instructions, your contribution will be marked as spam and you will be disqualified from Hacktoberfest.
What's Available so far?
1Password 364 bytes |
Acast 406 bytes |
Access 353 bytes |
ActivityPub 341 bytes |
Adobe 224 bytes |
Airbnb 360 bytes |
Alpine Linux 546 bytes |
Amazon 646 bytes |
Amazon Alexa 256 bytes |
Amazon Simple Storage Service 531 bytes |
Amber Framework 419 bytes |
andOTP 257 bytes |
Android 376 bytes |
AngelList 969 bytes |
Angular 321 bytes |
Ansible 315 bytes |
Apache AGE 730 bytes |
Apereo Foundation 461 bytes |
Apple 358 bytes |
Apple Music 494 bytes |
Apple Podcasts 945 bytes |
appwrite 728 bytes |
Arch Linux 312 bytes |
Atom 351 bytes |
Auth0 603 bytes |
Authy 337 bytes |
Azure 843 bytes |
Backbone 341 bytes |
Badoo 302 bytes |
Baidu 787 bytes |
Bandcamp 192 bytes |
Bash 760 bytes |
Behance 670 bytes |
Bing 943 bytes |
Bitbucket 669 bytes |
Bitcoin 518 bytes |
Bitwarden 290 bytes |
Blender 372 bytes |
Blogger 346 bytes |
Bluesky 400 bytes |
Bluetooth 370 bytes |
Brave 1000 bytes |
Briar 440 bytes |
Buffer 427 bytes |
Bugcrowd 779 bytes |
Bun 1020 bytes |
C 596 bytes |
Calendar 747 bytes |
CentOS 684 bytes |
Chrome 405 bytes |
Chromium 407 bytes |
Citrix 747 bytes |
Citrix 353 bytes |
Clojure 564 bytes |
Cloudflare 482 bytes |
Codeberg 467 bytes |
CodePen 307 bytes |
Coderwall 248 bytes |
CoffeeScript 517 bytes |
Coil 504 bytes |
coinpot 714 bytes |
Google Colab 377 bytes |
C++ 670 bytes |
Crystal 218 bytes |
CSS3 390 bytes |
Dart 549 bytes |
DataCamp 481 bytes |
Debian 926 bytes |
Deezer 710 bytes |
Delicious 263 bytes |
dev.to 524 bytes |
DeviantArt 267 bytes |
Digidentity 373 bytes |
DigitalOcean 248 bytes |
Discord 348 bytes |
Disqus 263 bytes |
Django Project 432 bytes |
Docker 420 bytes |
Draw.io 427 bytes |
Dribble 369 bytes |
Drone 295 bytes |
Dropbox 251 bytes |
Drupal 862 bytes |
Drupal 846 bytes |
DuckDuckGo 880 bytes |
Electronic Arts 283 bytes |
eBay 804 bytes |
Ecosia 780 bytes |
Edge 1017 bytes |
elastic 699 bytes |
Element 418 bytes |
Elementary OS 455 bytes |
Email 330 bytes |
Endeavour OS 626 bytes |
ePub 312 bytes |
Espressif 581 bytes |
Ethereum 385 bytes |
Etsy 467 bytes |
Evernote 617 bytes |
ExpressionEngine 632 bytes |
F-Droid 963 bytes |
Facebook 262 bytes |
Fediverse 1006 bytes |
Fedora 465 bytes |
Figma 623 bytes |
Filestash 271 bytes |
Finder 665 bytes |
Firebase 692 bytes |
Firefox 1009 bytes |
Flask 881 bytes |
Flatpak 565 bytes |
Flattr 335 bytes |
Flickr 241 bytes |
Floatplane 827 bytes |
Flutter 493 bytes |
foobar2000 459 bytes |
FreeBSD 703 bytes |
freeCodeCamp 705 bytes |
Friendica 825 bytes |
Fritz! 571 bytes |
Gandi 753 bytes |
GateHub 395 bytes |
GeeksForGeeks 518 bytes |
Gemini 618 bytes |
Ghost 248 bytes |
Git 369 bytes |
Gitea 752 bytes |
GitHub 518 bytes |
GitLab 429 bytes |
Gitpod 547 bytes |
Glitch 966 bytes |
Gmail 446 bytes |
Gmail 571 bytes |
Go 570 bytes |
Godot 585 bytes |
GOG.com 653 bytes |
Gojek 262 bytes |
Goodreads 374 bytes |
Google 451 bytes |
Google Assistant 370 bytes |
Google Authenticator 644 bytes |
Google Calendar 583 bytes |
Google Collaborative content tools 489 bytes |
Google Docs Editors 474 bytes |
Google Drive 564 bytes |
Google Drive 304 bytes |
Google Maps 556 bytes |
Google Maps 638 bytes |
Google Meet 517 bytes |
Google Play 424 bytes |
Google+ 384 bytes |
Google Podcasts 449 bytes |
Google Scholar 521 bytes |
Gradle 658 bytes |
Grafana 677 bytes |
GraphQL 510 bytes |
Grok 556 bytes |
Guacamole 658 bytes |
Guilded 334 bytes |
h-card 403 bytes |
h-entry 389 bytes |
h-feed 478 bytes |
Hacker News 217 bytes |
HackerOne 430 bytes |
HAML 877 bytes |
Heroku 438 bytes |
Homekit 736 bytes |
HP 475 bytes |
HTML5 439 bytes |
Hulu 463 bytes |
Humble Bundle 956 bytes |
i18next 716 bytes |
IBM 481 bytes |
iHeartRadio 772 bytes |
IMDb 510 bytes |
Imgur 267 bytes |
Instagram 704 bytes |
Intel 557 bytes |
Intercom 418 bytes |
Internet Archive 804 bytes |
itch.io 856 bytes |
iTunes 748 bytes |
Jacobin 230 bytes |
Java 783 bytes |
JavaScript 408 bytes |
Jellyfin 616 bytes |
jQuery 1010 bytes |
JSON-LD 894 bytes |
JSON 512 bytes |
JSON Feed 669 bytes |
JSR 415 bytes |
Julia 287 bytes |
JustGiving 353 bytes |
Kaggle 301 bytes |
KeePassDX 520 bytes |
Kemal Framework 329 bytes |
Keskonfai 683 bytes |
Keybase 636 bytes |
Kickstarter 277 bytes |
Ko-Fi 401 bytes |
Kodi 756 bytes |
Kotlin 240 bytes |
Laravel 388 bytes |
LastPass 285 bytes |
LeetCode 557 bytes |
Liberapay 548 bytes |
LibreSpeed 945 bytes |
LINE 458 bytes |
Linear 394 bytes |
LinkedIn 360 bytes |
Linux 954 bytes |
Linux Mint 359 bytes |
LinuxContainers 563 bytes |
Lobste.rs 508 bytes |
Lock 381 bytes |
Logitech 313 bytes |
Lucky Framework 475 bytes |
macOS 758 bytes |
Mail 555 bytes |
Mailchimp 985 bytes |
Malt 417 bytes |
Manjaro 226 bytes |
Markdown 422 bytes |
mastercard 326 bytes |
Mastodon 578 bytes |
matrix 645 bytes |
Mattermost 295 bytes |
McAfee 266 bytes |
McDonald's 438 bytes |
Medium 229 bytes |
Meetup 506 bytes |
Messenger 683 bytes |
microformats 787 bytes |
micropython 262 bytes |
Microsoft 325 bytes |
Minecraft 957 bytes |
MongoDB 357 bytes |
MySQL 1011 bytes |
NetBeans 525 bytes |
NetBSD 422 bytes |
Netflix 439 bytes |
NextCloud 253 bytes |
NGINX 454 bytes |
NHS 478 bytes |
NixOS 532 bytes |
nobara 838 bytes |
Node.js 655 bytes |
NordVPN 386 bytes |
Notion 971 bytes |
npm 281 bytes |
obs-logo 747 bytes |
OK.ru 354 bytes |
Olympic Rings 673 bytes |
OnlyFans 405 bytes |
OpenBenches 617 bytes |
Open Bug Bounty 491 bytes |
Opencast 298 bytes |
Open Collective 308 bytes |
OpenCores 269 bytes |
Open Source 282 bytes |
OpenStreetMap 955 bytes |
OpenVPN 282 bytes |
Opera 297 bytes |
Orcid 315 bytes |
Origin 634 bytes |
Outlook 880 bytes |
Overcast 765 bytes |
Overleaf 441 bytes |
Patreon 209 bytes |
PayPal 499 bytes |
PDF 654 bytes |
PeerTube 281 bytes |
Phone 578 bytes |
PHP 528 bytes |
Pinboard 245 bytes |
Pinterest 512 bytes |
Pixelfed 975 bytes |
Plausible 971 bytes |
PlayStation 519 bytes |
Plex 209 bytes |
Pocket 297 bytes |
Pocket Casts 267 bytes |
Pop!_OS 431 bytes |
Pornhub 814 bytes |
portronics 841 bytes |
Postman 734 bytes |
PowerShell 947 bytes |
Preact 337 bytes |
Printer 276 bytes |
ProductHunt 402 bytes |
Prometheus 983 bytes |
Proton Mail 632 bytes |
Python 499 bytes |
QQ 937 bytes |
quora 268 bytes |
R 956 bytes |
Raspberry Pi 909 bytes |
React 343 bytes |
Reddit 596 bytes |
RedHat 538 bytes |
Replit 535 bytes |
Research Gate 870 bytes |
Roblox 289 bytes |
Rockstar Games 839 bytes |
Roundcube 518 bytes |
RSS 280 bytes |
Ruby 945 bytes |
Ruby Gems 275 bytes |
Ruby On Rails 451 bytes |
Rust 904 bytes |
Safari 689 bytes |
Samsung 834 bytes |
Samsung Internet 316 bytes |
Samsung 606 bytes |
Samsung 871 bytes |
Sass 505 bytes |
Semantic Web 421 bytes |
Semaphore CI 395 bytes |
Sentry 363 bytes |
Signal 427 bytes |
Sketch 357 bytes |
Skype 472 bytes |
Slack 389 bytes |
SlideShare 650 bytes |
Snapchat 637 bytes |
SOGo 828 bytes |
solana 398 bytes |
Solidity 552 bytes |
SoundCloud 948 bytes |
SPARQL 796 bytes |
Spotify 422 bytes |
Square Cash 779 bytes |
Stack Exchange 390 bytes |
Stack Overflow 290 bytes |
Steam 445 bytes |
Stitcher 376 bytes |
Strava 273 bytes |
StumbleUpon 347 bytes |
Sublime Merge 555 bytes |
Sublime Text 593 bytes |
SubscribeStar 587 bytes |
Svelte 474 bytes |
SVG 750 bytes |
Swift 662 bytes |
Symantec 600 bytes |
Symfony 613 bytes |
taiga.io 735 bytes |
tailwindCss 539 bytes |
TATA 1013 bytes |
Teamspeak 925 bytes |
Telegram 480 bytes |
TensorFlow 445 bytes |
Terraform 288 bytes |
This American Life 282 bytes |
Threads 368 bytes |
Threema 385 bytes |
TikTok 343 bytes |
Todoist 741 bytes |
Tox 484 bytes |
Trello 266 bytes |
TripAdvisor 646 bytes |
Tumblr 255 bytes |
TuneIn 574 bytes |
Tutanota 526 bytes |
Twilio 315 bytes |
Twitch 275 bytes |
Twitter 356 bytes |
TypeScript 607 bytes |
Uber 591 bytes |
Ubiquiti 544 bytes |
Ubisoft 507 bytes |
Ubuntu 442 bytes |
Udemy 293 bytes |
Unicode 364 bytes |
Unreal Engine 959 bytes |
Untappd 399 bytes |
Uphold 803 bytes |
Uplay 521 bytes |
Upwork 488 bytes |
Vagrant 541 bytes |
Vegetarian 672 bytes |
Venmo 275 bytes |
Vercel 184 bytes |
Viber 697 bytes |
VictoriaMetrics 377 bytes |
Vim 703 bytes |
Vimeo 336 bytes |
visa 627 bytes |
Visual Studio Code 899 bytes |
Vivino 284 bytes |
VK 523 bytes |
VLC 640 bytes |
Vue 261 bytes |
W3C 527 bytes |
Wayland 910 bytes |
WebAssembly 480 bytes |
WebMention 266 bytes |
WebToons 977 bytes |
WeChat 611 bytes |
Wekan 970 bytes |
WhatsApp 439 bytes |
WHATWG 317 bytes |
WiFi 566 bytes |
Wikipedia 567 bytes |
Windows 230 bytes |
Wire 260 bytes |
WireGuard 952 bytes |
WordPress 492 bytes |
Workato 367 bytes |
X 291 bytes |
X11 760 bytes |
XING 351 bytes |
XMPP 681 bytes |
Yahoo! 285 bytes |
YAML 400 bytes |
Yammer 468 bytes |
Yarn 501 bytes |
Yelp 452 bytes |
Yii 767 bytes |
YouTube 337 bytes |
Yubico 254 bytes |
Zoom 519 bytes |
Zorinos 258 bytes |
Why so smallious?
Bytes cost money. They cost money to store, transport, and process. Simplicity should be our goal in all endeavours.
Scream if you want to go smaller
These files were edited by hand in Inkscape, Illustrator, or a text editor, then were minified using Yann Armelin's SVG Path Editor, svgo, and svgcleaner. Further smallification may be possible. Try it!
- Each of these has an
xmlns="http://www.w3.org/2000/svg"
in the<svg>
tag. This isn't strictly necessary - but some web browsers won't display them as an image without it. - The background colour can also be excluded if you're including it elsewhere.
- Colours can be simplified.
#FF0000
becomesred
. - The precision of the paths is mostly 0 decimal places. A few logos have 1 or 2 dp to make them look more accurate. The precision can be reduced if necessary.
Think you can make them smaller? Tell me by raising an issue!
Want more icons? Tell me by raising an issue!
Think the icons look wrong? Compare them against the official logos. If they still look wrong, tell me by raising an issue!
Android Vector Drawables
Icons also available as Android Vector Drawables, so you can easily use them in Android apps.
They are not guaranteed to be under 1KB.
Submitting Icons
I'd love you to submit something ð¸ The rules are simple, your icon must:
- be under 1024 bytes. That is, the maximum file size is 1023 bytes. No arguments.
- fit inside a circle with radius 256 pixels. Set
rx="50%"
to check. - represent a popular service's current logo.
Template
At a minimum, your icon needs these components:
<svg xmlns="http://www.w3.org/2000/svg"
aria-label="..." role="img"
viewBox="0 0 512 512"><path
d="m0 0H512V512H0"
fill="#fff"/> ... </svg>
Icon accessibility
The super tiny icons are accessible by default. Each icon has:
role="img"
, to expose the<svg>
elements as images in the browser's accessibility treearia-label="XYZ"
(where XYZ is the icon's brand name), to give the icon an accessible name
Note:
if using the <svg>
as the src
for an <img>
element, the alt
attribute should still be used on the <img>
element because the ARIA is not recognised in this context.
CSS-Tricks has also an article about accessible SVG icons.
Guidelines
This is the standard guideline. Use this to help with sizing your icons and they will look good no matter what border radius is chosen.
- Green is the safe zone, where the main body of the icon should be.
- Yellow is like a road shoulder, it is there if more space is needed. It should be used for protruding elements, like corners or ornaments.
- Red is off limits. It should not be touched by the icons. Red is also how a circular icon would look.
Installation
npm install --save super-tiny-icons
Usage
The old-school way:
<img src="./node_modules/super-tiny-icons/images/svg/github.svg" />
The modern way, the React (JSX) example:
import logo from "super-tiny-icons/images/svg/github.svg";
<img src={logo} />;
CSS can be used to customize an icon's appearance. The following example shows styles for small/medium/large icons with square/rounded/circular frames:
<style>
.small-square {
width: 20px;
}
.medium-rounded {
width: 50px;
border-radius: 10%;
}
.large-circular {
width: 100px;
border-radius: 50%;
}
</style>
<img src="images/svg/reddit.svg" class="small-square" />
<img src="images/svg/reddit.svg" class="medium-rounded" />
<img src="images/svg/reddit.svg" class="large-circular" />
Contributors
Code Contributors
This project exists thanks to all the people who contribute. [Contribute].
Financial Contributors
Become a financial contributor and help us sustain our community. [Contribute]
Individuals
Organizations
Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]
Licenses
The majority of these vector logos are based on someone else's work.
- Social Media Icons by Aha-Soft - CC-BY
- Phone Icon - Free
- Lock Icon - MIT
- Wire Logo - Public Domain
- Signal Logo - GPLv3
- RSS Icon - MPL 1.1
- PDF Icon - Free
- Google+ - Public Domain
- Mastodon - AGPLv3
- GitLab
- HTML5 Shield - CC-BY
- npm Logo - CC-BY
- Docker Logo - Apache
- Steam
- Symantec
- Yubico - BSD
- Keybase - BSD
- eBay
- Kickstarter
- Bitcoin - CC0
- Bluetooth
- Blogger
- Medium
- Ghost
- Tumblr
- Intel
- Badoo
- YouTube
- Google Play
- Gmail
- Samsung Internet
- Plex - GPLv2
- NHS
- Threema.
- CoreUI - CC-BY
- NixOS - CC-BY
- Yii PHP Framework - CC BY-ND 3.0
From SVGporn - CC0
IBM, Yammer, Android, Authy, Cloudflare, CodePen, DigitalOcean, Discord, Airbnb, WiFi, Delicious, Open Source, Patreon, Tim Cuthbertson
Where possible, they retain their original licenses. Some logos may be subject to copyright and trademark laws, but these files are small enough to memorise.
Top Related Projects
SVG icons for popular brands
The iconic SVG, font, and CSS toolkit
A scalable set of icons handcrafted with <3 by GitHub
Official open source SVG icon library for Bootstrap.
Simply beautiful open-source icons
Premium hand-crafted icons built by Ionic, for Ionic apps and web apps everywhere 🌎
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot