Getting started
Usage
Every icon is a React component. Import the ones you need by name; the component name is the PascalCase form of the file name (credit-card → CreditCard).
toolbar.tsx
import { Home, Search, Wallet } from "krz-icons";
export function Toolbar() {
return (
<>
<Home />
<Search size={20} color="#06D6A0" />
<Wallet strokeWidth={1.5} title="Wallet" />
</>
);
}Each icon is also exported with an Icon suffix (HomeIcon) in case the plain name clashes with your own components. The package is tree-shakeable, so only the icons you import end up in your bundle. You can also import a single icon directly:
tsx
import Home from "krz-icons/icons/home";