Social Icons

Social icons are a great way to make your website more engaging and user-friendly. You can use social icons to help users quickly find your social media profiles and connect with you.

Installation

This part of Tabler is distributed as a plugin. To enable it you should include tabler-socials.css or tabler-socials.min.css file in your page.

You can also include the plugin via CDN:

<link rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@tabler/[email protected]/dist/css/tabler-socials.min.css" />

Social icons

To create a social icon, add the social class to a component and also add the class for the specific social app whose icon you want to use.

<span class="social social-app-facebook"></span>
<span class="social social-app-x"></span>
<span class="social social-app-instagram"></span>

Social apps list

Here is a list of all available social apps:

App	Name	CSS class
	Apple	.social-app-apple
	Discord	.social-app-discord
	Dribbble	.social-app-dribbble
	Facebook	.social-app-facebook
	Figma	.social-app-figma
	GitHub	.social-app-github
	Google	.social-app-google
	Instagram	.social-app-instagram
	LinkedIn	.social-app-linkedin
	Medium	.social-app-medium
	Meta	.social-app-meta
	MetaMask	.social-app-metamask
	Pinterest	.social-app-pinterest
	Reddit	.social-app-reddit
	Signal	.social-app-signal
	Skype	.social-app-skype
	Snapchat	.social-app-snapchat
	Spotify	.social-app-spotify
	Telegram	.social-app-telegram
	TikTok	.social-app-tiktok
	Tumblr	.social-app-tumblr
	Twitch	.social-app-twitch
	VK	.social-app-vk
	X (Twitter)	.social-app-x
	YouTube	.social-app-youtube