Alma Icons

Choose an icon style and weight

Start at the size used in your interface

Compare variants at the actual display size, next to the text and controls they accompany. A large preview is useful for inspecting geometry, but it does not show how a small toolbar will read.

Compare outline and fill

Outline emphasizes the contour; fill gives the shape more visual mass. You can use the two styles to distinguish states, but keep labels or another clear state cue where meaning would otherwise be ambiguous.

Choose a consistent weight

Alma uses named weights from 100 to 500. These are separate SVG assets, not CSS font weights. Select an available variant on the icon page instead of changing stroke-width on the exported paths.

Check the whole set

Compare neighboring icons together. Use the same weight and display dimensions as a starting point, then check legibility, contrast and alignment in both light and dark themes. Each icon page lists the variants that actually exist.

Explore the icons

Browse icon categories or open the interactive catalog.

By Misha Grebennikov. Licensed under CC BY-NC 4.0: attribution required, non-commercial use only. License details.

See the package documentation for more integration options.