Ikonate

Ikonate is an accessibility-focused, fully customisable set of well-optimised vector icons created by Mikolaj Dobrucki. Launched in 2019, the library has earned over 3,600 GitHub stars thanks to its unique approach to icon customization and its commitment to inclusive design practices.\n\nEvery icon is built on a 24x24 pixel grid using clean stroke-based SVG paths with a default 2px stroke weight. What sets Ikonate apart from most icon libraries is its deep CSS customizability - you can adjust color, size, stroke width, stroke-linecap (round or square), and stroke-linejoin directly through CSS properties without modifying the SVG source files. The ikonate.com website provides an interactive configurator where you can preview all icons with your chosen settings and export them as individually styled SVG files or as a single optimized SVG sprite.\n\nAccessibility is a core design principle. Each icon ships with title and description elements as placeholders, following SVG accessibility best practices. The project documentation emphasizes that developers should customize these labels based on the actual role of each icon in their application, and references Chris Coyier's guide on making icon systems accessible.\n\nFor developers, Ikonate is available as an npm package with build tools for generating inline SVG demos and SVG sprites. Icons can be used three ways: as standalone SVG files (ideal for designers working in Sketch, Photoshop, or Figma), as inline SVGs for full CSS control, or as an SVG sprite for efficient loading. A community-maintained React wrapper (react-ikonate) provides typed components with props for border width, size, style (square, roundSquare, round), and color, plus a context provider for applying consistent styles across an entire component tree. A Figma Community file with 338 editable vector icons is also available.\n\nThe icon set covers essential UI categories including arrows, navigation, communication, media controls, file management, social, weather, editing, notifications, and more. Icons are highly optimized out of the box - stripped of unnecessary SVG code that bloats file size and hurts performance.