2. To use an icon on your page, add a class 'bx' and seperate class with the icons name with a prefix 'bx-' for regular icons , 'bxs-' for solid icons and 'bxl-' for logos:
The `<box-icon>` custom element supports the following attributes:
```html
<box-icon
name="adjust|alarms|etc...."
color="blue|red|etc..."
size="xs|sm|md|lg|cssSize"
rotate="90|180|270"
flip="horizontal|vertical"
border="square|circle"
animation="spin|tada|etc..."
type = "regular|solid|logo"
pull = "left|right"
></box-icon>
```
-`name` : (REQUIRED) the name of the icon to be displayed
-`color`: A color for the icon.
-`size`: The size for the icon. It supports one of two types of values:
- One of the followign shortcuts: `xs`, `sm`, `md`, `lg`
- A css unit size (ex. `60px`)
-`rotate`: one of the following values: `90`, `180`, `270`
-`flip`: one of the following values: `horizontal`, `vertical`
-`border`: one of the following values: `square`, `circle`
-`animation`: One of the following values: `spin`, `tada`, `flashing`, `burst`, `fade-left`, `fade-right`, `spin-hover`, `tada-hover`, `flashing-hover`, `burst-hover`, `fade-left-hover`, `fade-right-hover`
-`type`: one of the following values: `regular`,`solid`, `logo`
-`pull`: one of the following values: `left`,`right`
The Custom Element class (`BoxIconElement`) exposes the following static members:
-`tagName`: property that holds the HTML element tag name. Default: `box-icon`
-`defined([tagName])`: Defines the Element in the custom element registry using either the tagName provided on input or the (default) the one defined on the Class.
-`cdnUrl`: property that holds the URL that will be used to retrieve the images. URL should point to the folder that contains the images. example: `//unpkg.com/boxicons@1.5.2/svg` (no trailing forward slash)
-`getIconSvg(iconName)`: method used to retrieve the SVG image. Should return a Promise that resolves with the SVG source (String).