README.md

Jsx Social Icons with link

---

Install

npm i jsx-social-icons

pnpm i jsx-social-icons

yarn add  jsx-social-icons

React

import ReactSocialIcon from "jsx-social-icons/react";

export function Home() {
  return (
    <main>
      <ReactSocialIcon
        name="github"
        href="https://github.com"
        size={36}
        fillColor="#673ab8"
        fillOpacity={0.9}
        title="Link to my github profile"
        target="_blank"
        className="My class"
      />
    </main>
  );
}

Preact

import PreactSocialIcon from "jsx-social-icons/preact";

export function Home() {
  return (
    <div>
      <PreactSocialIcon
        name="github"
        href="https://github.com"
        size={36}
        fillColor="#673ab8"
        fillOpacity={0.9}
        title="Link to my github profile"
        target="_blank"
        className="My class"
      />
    </div>
  );
}

Options

Name	Description	Default
name	Name of icon
href	HTML Anchor Element Attribute "href"	" # "
target	HTML Anchor Element Attribute "target"	"_blank"
className	HTML Anchor Element "className"	" "
title	Tooltip text for icon	name of icon
size	Size for icon	24
fillColor	Color for icon	"currentcolor"
fillOpacity	Opacity of icon. 0.1 to 1	0.7

---

All of these icons are from simple icons - https://simpleicons.org/ - https://github.com/simple-icons/simple-icons

License - https://github.com/simple-icons/simple-icons?tab=CC0-1.0-1-ov-file#cc0-10-universal

Legal Disclaimer : https://github.com/simple-icons/simple-icons/blob/develop/DISCLAIMER.md#disclaimer