Nova Icons

This package provides a utility component for rendering Material Symbols or custom Nova icons.

Installation

# With npm
npm install @hxnova/icons@beta

# With pnpm
pnpm add @hxnova/icons@beta

# With yarn
yarn add @hxnova/icons@beta

Usage

Import CSS

Import the icons.css file either in your application root file or top-level css. This will set up the necessary icon fonts in order to render the icons.

// in TS/JS file
import '@hxnova/icons/icons.css'

@import '@hxnova/icons/icons.css';

Use the Icon component

Material Symbols

import { Icon } from '@hxnova/icons';

// outlined style
<Icon family="material" name="home" />
// filled style
<Icon family="material" name="home" filled />

Nova Custom Icons

import { Icon } from '@hxnova/icons';

// outlined style
<Icon family="nova" name="Plane-Z" />

Styling

The icon component can be customized using the size and color props. You can also further style the icon using CSS:

<Icon family={'material'} name={'home'} size={40} color={'gray'} />