Skip to content

Icons

@signicat/catnip-icons provides the icon font for CSS usage and exports SVG assets. Use it when you need font-based icons or to export SVGs for design tools.

Icon library

Browse all available icons in the Icons assets page.

Install

bash
npm install @signicat/catnip-icons

Import

css
@import "@signicat/catnip-icons";

Font usage

After importing the styles, use the .catnip-icon--{iconName} class. Icon names match the SVG filename without extension (use kebab-case).

html
<i class="catnip-icon--user"></i>
<i class="catnip-icon--check"></i>
<i class="catnip-icon--settings"></i>

Icons inherit color via currentColor. Control size with font-size:

css
.my-icon {
  font-size: 24px;
}

SVG export

The package exports SVG files for use in design tools. Check the package svg/ directory or @signicat/catnip-icons/svg for the icon map and filenames.

Catnip Design System by Signicat