Social Link Button

Styled social media link buttons with platform-specific colors and icons.

Preview

Usage

import { SocialLinkButton } from "@/components/profile"

<SocialLinkButton 
  platform="instagram" 
  href="https://instagram.com/username"
  variant="pill"
/>

Platforms

Variants

Pill

Card

Icon

<SocialLinkButton variant="pill" />   // Rounded pill with icon + label
<SocialLinkButton variant="card" />   // Full-width card style
<SocialLinkButton variant="icon" />   // Icon only

Custom Labels

<SocialLinkButton 
  platform="youtube" 
  label="Watch Videos" 
/>

Props

PropTypeDefaultDescription
platform"instagram" | "twitter" | "youtube" | "twitch" | "github" | "linkedin" | "tiktok" | "spotify" | "store" | "website" | "custom"-Social platform
hrefstring-Link URL
variant"pill" | "card" | "icon""pill"Button style
labelstring-Custom label text