🚀 SocialShareButton

A lightweight, modern, and highly customizable social sharing component

📦 Zero Dependencies ⚡ < 10KB 📱 Mobile Ready ♿ Accessible 🎨 Customizable

✨ Key Features

🌐

7+ Platforms

WhatsApp, Facebook, X, LinkedIn, Telegram, Reddit, Email

🎨

Themeable

Dark and light themes with full CSS customization

⚙️

Framework Agnostic

Works with React, Vue, Angular, or vanilla JS

📐

Responsive

Optimized for all screen sizes

🎨 Button Styles

Choose from multiple pre-built styles or create your own

Default

Clean, minimal design

Primary

Eye-catching gradient

Light Theme

Light backgrounds

Compact

Space-saving variant

Icon Only

Minimal footprint

🎨 Custom Button Colors

Customize button colors to match your brand palette

Red Theme

#f44336 - Material Red

Green Theme

#10b981 - Emerald Green

Blue Theme

#3b82f6 - Sky Blue

Purple Theme

#a855f7 - Custom Purple

Orange Theme

#f97316 - Vibrant Orange

Pink Theme

#ec4899 - Hot Pink

🔧 Custom Platform Selection

Choose which platforms to display

Professional

LinkedIn, X, Email

Social Media

Facebook, X, reddit

Messaging

WhatsApp, Telegram

🚀 Quick Start

Get started in seconds with minimal setup

// Include CSS and JS
<link rel="stylesheet" href="social-share-button.css">
<script src="social-share-button.js"></script>

// Initialize
new SocialShareButton({
  container: '#share-button',
  url: 'https://your-website.com',
  title: 'Check this out!',
  description: 'An amazing website'
});
      

⚛️ React Integration

First-class React support with hooks

import SocialShareButton from 'social-share-button';

function App() {
  return (
    <SocialShareButton
      url="https://your-website.com"
      title="Check this out!"
      onShare={(platform) => {
        console.log('Shared on:', platform);
      }}
    />
  );
}
      

Ready to Get Started?

View on GitHub →