AlmaIcons

!image

!Version


!image

The versatile collection of 450+ multi-weight icons designed with varying stroke widths to seamlessly match different UI styles.

Perfect for building modern, consistent interfaces with flexible visual weight.

- 2 styles: fill & outline
- 5 weights: 100 - 500
- 470 unique icons

Demo

🌐 almaicons.netlify.app

Preview

Here are just a few examples (each available in 2 styles × 5 weights):

| Icon name | Fill (300) | Outline (300) |
| -------------- | -------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
| rocket |  |  |
| football |  |  |
| bag |  |  |
| folderClosed |  |  |

> 👉 Every icon supports weights 100 → 500.

Installation

Using pnpm:

``bash
pnpm add alma-icons
`

Using npm:

`bash
npm install alma-icons
`

Using yarn:

`bash
yarn add alma-icons
`

Usage

Import icons dynamically in your Vue or React project.

$3

`vue




`

`ts
// icon.ts

import { iconNames, iconStyles, iconWeights } from "alma-icons";

import type { UIElementVariant } from "@/typings";

export type IconName = (typeof iconNames)[number];

export type IconStyle = (typeof iconStyles)[number];

export type IconWeight = (typeof iconWeights)[number];

export interface IconProps {
variant?: UIElementVariant;
name: IconName;
style: IconStyle;
weight: IconWeight;
}

export * from "alma-icons";
`

$3

AlmaIcons provides strict type support:

`ts
import type { IconName, IconStyle, IconWeight } from "alma-icons";

const name: IconName = "check";
const style: IconStyle = "fill";
const weight: IconWeight = "400";
`

_This enables autocomplete and prevents invalid icon usage._

Development

To regenerate manifest after adding new icons:

`bash
pnpm generate
`

This updates index.js and index.d.ts` with all available icons, names, styles, and weights.

License

AlmaIcons © 2025 (Misha Grebennikov)[https://github.com/yamogoo]

Licensed under the (CC BY-NC 4.0)[https://creativecommons.org/licenses/by-nc/4.0/]
.

- You must give appropriate credit, provide a link to the license, and indicate if changes were made.

- You may not use the icons for commercial purposes.