A set of beautiful svg social icons. Easily used in React. No images or external css dependencies. Svg paths provided by Squarespace.
Here are the available icons.
By default, pass the url of your social network, and the icon will be detected from the url.
<SocialIcon url="http://linkedin.com/in/jaketrent" />
If you have a need to specify the network, you can. If you don't specify a url, your
href attribute will be omitted. You can include props for both url
and network. The network prop takes precedence.
<SocialIcon url="http://jaketrent.com" network="tumblr" />
You can override the fill color associated with the network with the color prop.
<SocialIcon network="pinterest" color="#ff5a01" />
The full code required to render.
var React = require('react');
var { SocialIcon } = require('react-social-icons');
React.render(<SocialIcon url="http://linkedin.com/in/jaketrent" />, document.body);
Witness the beautiful SVG in action.
Note: this library injects on-page style tags into the head. This is great because you don't have to import any additional stylesheet to support this library. But more specificity in selectors will be required when overriding default styles from external stylesheets.
If you're interested in adding additional networks or helping make the library better, fork it on github and let the code fly!