Svelte Social Icons

Beautiful, easy SVG social icons in Svelte

#svelte #social-network #icons #icon #svg #sveltekit

Svelte Social Icons

Social icons for Svelte. Based on react-social-icons by Jake Trent.

To install:

pnpm install @rodneylab/svelte-social-icons

Alternatively, replace pnpm with npm or run yarn add @rodneylab/svelte-social-icons.

To use:

<script>
  import SocialIcons from '@rodneylab/svelte-social-icons';
</script>

<SocialIcons network="github" alt=""/>
<SocialIcons network="twitter" alt=""/>

Change icon size:

<SocialIcons alt="" network="github" width="24" height="24" />

Change foreground and background colours:

<SocialIcons alt="" network="github" fgColor="#eeeeee" bgColor="#111111" />

Props

Property	Type	Required	Description
network	Network	Yes	Override which network icon to render. You can import the type if you need it in TypeScript: `import type { Network } from '@rodneylab/svelte-social-icons';`
bgColor	String	No	Override the background fill colour (defaults to social network's color).
fgColor	String	No	Override the icon's fill colour (defaults to transparent).
style	Object	No	Override style properties passed to the rendered anchor tag.

Top categories

tailwind daisyui admin template popup mdsvex portfolio blog form ecommerce ui carousel auth dark seo image routing