@alexfrih/social-icons

React SVG social media icons with configurable size and color.

Install

npm i @alexfrih/social-icons
# or
pnpm add @alexfrih/social-icons
# or
yarn add @alexfrih/social-icons

Usage

import { 
  FacebookIcon, 
  InstagramIcon, 
  LinkedInIcon, 
  TikTokIcon, 
  YouTubeIcon,
  DiscordIcon,
  GitHubIcon,
  XIcon
} from "@alexfrih/social-icons";

export default function Example() {
  return (
    <div style={{ display: "flex", gap: 12 }}>
      <FacebookIcon size={24} color="#1877F2" />
      <InstagramIcon size={28} color="#E1306C" />
      <LinkedInIcon size={24} color="#0A66C2" />
      <TikTokIcon size={32} color="#000" />
      <YouTubeIcon size={28} color="#FF0000" />
      <DiscordIcon size={24} color="#5865F2" />
      <GitHubIcon size={24} color="#000" />
      <XIcon size={24} color="#000" />
    </div>
  );
}

Available Icons

• FacebookIcon
• InstagramIcon
• LinkedInIcon
• TikTokIcon
• YouTubeIcon
• DiscordIcon
• GitHubIcon
• XIcon

Props

• size: number or string (e.g., 24 or "1.5rem"). Defaults to 24.
• color: any CSS color. Defaults to currentColor.
• All other SVGProps<SVGSVGElement> are forwarded.

Design

Icons are available in Figma: Social Icons Design System

Development

• Build: npm run build

License

MIT