2.0.12 • Published 3 years ago
@aminya/solid-icons v2.0.12
✨ Features
- 16 Icon packs totally ready to use.
- Compatible with Solid Start static generation and SSR.
- Tree shakeable: What you take is what you get.
- Customizable - receive props to extend their usefulness.
- Reactivity, take advantage of SolidJS to react to changes in props.
- Just import and declare in your JSX to work out-the-box
- First class TypeScript support
📦 Installation
Yarn
yarn add @aminya/solid-iconsNPM
npm install @aminya/solid-icons --saveUsage
import { SiJavascript } from "@aminya/solid-icons/si/SiJavascript";
<SiJavascript size={24} color="#2c4f7c" />;🔋 Included icons pack
| Icon Library | License | Version |
|---|---|---|
| Ant Design Icons | MIT | 4.1.0 |
| Bootstrap Icons | MIT | 1.7.2 |
| BoxIcons | CC BY 4.0 License | 2.1.1 |
| Feather | MIT | 4.28.0 |
| Font Awesome | CC BY 4.0 License | 6.1.2 |
| Heroicons | MIT | 1.0.3 |
| IcoMoon Free | CC BY 4.0 License | 1.0.0 |
| Ionicons | MIT | 5.5.2 |
| Remix Icon | Apache License Version 2.0 | 2.5.0 |
| Simple Icons | CC0 1.0 Universal | 6.7.0 |
| Typicons | CC BY-SA 3.0 | 2.1.2 |
| VS Code Icons | CC BY 4.0 | 0.0.27 |
| Weather Icons | SIL OFL 1.1 | 2.0.12 |
| css.gg | MIT | 2.0.0 |
| Tabler Icons | MIT | 1.119.0 |
| Github Octicons | MIT | 17.3.0 |
⚙️ Configuration
solid-icons components receive props like any SVG, you also have a few custom ones.
import { SiJavascript } from "solid-icons/si";
<SiJavascript size={24} color="#2c4f7c" class="custom-icon" title="a11y" />;| Key | Default | Notes |
|---|---|---|
color | currentColor (inherit) | |
size | 1em | |
class | undefined | |
title | undefined | A icon title a11y |
💻 Development
requirements:
node ^16.14.0
Basic build
You can locally clone this repository:
$ git clone https://github.com/x64Bits/solid-icons
$ cd solid-icons
$ yarn
$ yarn buildBuild dev mode
If you did the above steps and want to build while listening if the files change you can run:
$ yarn devSupported arguments
Isolate a single library, this allows you to avoid recompiling the entire library and thus optimize the result of a single one:
$ yarn dev --isolate="ai"This command is used to build the files destined for web, if you want to change the path, in src/build/constants.ts you can modify the output of the files:
$ yarn dev --web📝 Licence
MIT
- Icons are taken from the other projects so please check each project licences accordingly.