logo polydile dile-components

dile-social-icon

Web component to display icons from the main social networks and communities, based on Lit.

Installation

  1. Install the npm package
npm i @dile/dile-social-icon

Usage

Import the component

import '@dile/dile-social-icon/dile-social-icon.js';

Use the web component

<dile-social-icon icon="facebook"></dile-social-icon>

The icon property is used to set the icon you want to show. There are icons from the main social networks and services.

Icons available

The icon property accepts the social icons listed bellow:

Available icons

Note that the name of the icons is always in lowercase.

Custom styles

You can customize the icon styles using CSS Custom Styles.

Custom propertyDescriptionDefault
--dile-social-icon-colorIcon color#888
--dile-social-icon-sizeIcon size (this sets width & height to the same value)24px