coreui icons angular

CoreUI Icons Component for Angular. CoreUI Icons SVG Set implementation for Angular.

2
1
TypeScript

Code moved to:
https://github.com/coreui/coreui-angular/tree/main/projects/coreui-icons-angular


CoreUI logo

CoreUI Icons for Angular


Explore CoreUI for Angular docs »

CoreUI Icons »

Report a bug · Request a feature · Blog

CoreUI Icons Angular

angular
angular
npm-coreui-angular-next
NPM
Downloads
License

cIcon directive

Angular directive for CoreUI Icons SVG set.

Features

  • Load icons:
    • stored in Angular root service,
    • directly passed SVG content,
  • Reduce icons bundle size when imported as single icons,
  • Full functionality of <svg> tag,
  • Clean API

For directive description visit https://coreui.io/angular/docs/4.0/

Installation

npm install @coreui/icons
npm install @coreui/icons-angular

Usage

// app NgModule

import { IconModule, IconSetService } from '@coreui/icons-angular';

@NgModule({
  imports: [
    IconModule,
...
  providers: [IconSetService],
...
// app component

import { cilEnvelopeOpen, flagSet } from '@coreui/icons';
import { IconSetService } from '@coreui/icons-angular';

@Component({
  ...
})
export class AppComponent implements OnInit {
  constructor(public iconSet: IconSetService) {
    // iconSet singleton
    iconSet.icons = { cilEnvelopeOpen, ...flagSet };
  }
...
<svg cIcon name="cil-envelope-open" size="lg"></svg>
<svg cIcon name="cifAu"></svg>

API

Icon directive

Use one of name or content prop as it defines the way of icon import

Inputs
proprerty type default description
name string undefined name of SVG icon stored in IconSetService
content string, string[] undefined SVG content
size custom, custom-size, sm, lg, xl, xxl, 3xl, 4xl, 5xl, 6xl, 7xl, 8xl, 9xl ‘’ Size of icon
title string undefined
customClasses string undefined Overwrites default .icon classes
viewBox string undefined SVG viewbox
width string undefined SVG width
height string undefined SVG height

IconSet service

Props
proprerty type default description
getIcon() (string): any[] returns an icon
icons IIconSet undefined IconSet object
iconNames [key: string]: string undefined returns icon name from key

License

CoreUI Icons Free are free, open source, and GPL friendly. You can use it for
commercial projects, open source projects, or really almost whatever you want.

  • Icons — CC BY 4.0 License
    • In the CoreUI Icons Free download, the CC BY 4.0 license applies to all icons packaged as .svg and .js files types.
  • Fonts — SIL OFL 1.1 License
    • In the CoreUI Icons Free download, the SIL OLF license applies to all icons packaged as web and desktop font files.
  • Code — MIT License
    • In the CoreUI Icons Free download, the MIT license applies to all non-font and non-icon files.