@celcomdesign/iconography v2.1.1
Prisma Icons
Quick start
The index.html list all the icons available.
SVG icons
The SVG folder contains the icons as separate SVG files.
Usage
External image
Copy the Prisma Icons SVGs to your directory of choice and reference them like normal images with the <img> element.
<img src="./svg/logo/logo-celcom-life.svg" alt="" width="32" height="32" title="Celcom Life"/>
Sprite
If you prefer using SVG sprites, it's available in sprite folder. To insert your icons as inline SVGs (with the <use> element), copy the <svg> element (that contains symbol definitions) from the source of the index.html file, below your own HTML's <body> tag. After copying this SVG, you can reference your glyphs like the following:
<svg class="icon" aria-hidden="true" width="32" height="32"><use xlink:href="./sprite/prisma-icons.symbol.svg#home-dashboard"></use></svg>
It's currently limited to normal icons, colored icons and expressive icons only.
Known issues
To do
A lot of manual work currently. Will need to automate most of the things.
Current publishing method :
npm run publish -> npm run svgtofont -> copy HTML codes manually
Changelog
Version 2.0.3 (Updated July 2021)
- Added 17 new icons and expressive
- Fix renaming icons
Version 2.0.2 (Updated May 2021)
- Added 6 icons
- Fix "appointment" & "no-wall-hacking" icons
- Automated sprites generate (@twbs/svg-sprite)
- Manually include icons in HTML (svgtofont)
Version 2.0.1 (Updated May 2021)
- Added 10+ icons, expressive and logos
- Clean up duplicates and copies
- Fix Celcom logos
- Manual work to generate sprites and HTML
Version 2.0.0 (Released Nov 2020)
- Initial release