Icons
Die eigenen Linien-Icons des Kits in 18 Gruppen, gezeichnet auf einem 24er Raster.
Eine von 5 Components in Data Display
Details
Was Icons mitbringt, aus Registry und Quellcode gelesen.
- Kategorie
- Data Display
- Bereich
- Elements
- Variants
- 3
- Version
- 1.0.1 · seit 1.0.0
- Datei
- components/ui/icon.tsx
- Bringt mit
- utils
- npm-Pakete
- Keine
- Sprachen
- Texte kommen über Props
- Studio
- Im Code anpassen
- Mit KI bauen
- Per MCP in Claude, Cursor, Copilot und Codex
Props
Die Schnittstelle IconProps aus components/ui/icon.tsx. Beschreibungen stammen aus den Kommentaren im Code und sind auf Englisch. Nimmt außerdem alle Props von Omit<React.SVGProps<SVGSVGElement>, 'name'> an.
namePflichtIconNamesizeoptionalnumberlabeloptionalstringLabel for screen readers. Without it the icon is decorative and hidden.
Barrierefreiheit
Aus dem Quellcode der Component abgeleitet.
- Setzt aria-label, damit Screenreader Zweck und Zustand ansagen.
- Nutzt die Rolle label.
- Kommt ohne Client-State aus. Der Server schreibt sie vollständig, sie ist auch ohne JavaScript lesbar.
Bewegung
- Ohne Animationen, sie steht sofort ruhig da.
Quellcode
Die Datei, die aiw add in dein Projekt legt. Sie gehört danach dir.
Datei anzeigen, 400 Zeilen
'use client';
import { cn } from '@/lib/kit';
/*
* UI Master Kit icons. Drawn for this kit on a 24 px grid, 1.6 px stroke,
* round caps. Built from plain geometry, no third-party icon set.
* Add new ones in the same style: 2 px safe area, optical center, no fills.
* Search for the name first: a name defined twice breaks the type check.
* The full set with groups is shown in the icons demo (src/demos/blocks/icon.tsx).
*/
export const ICONS = {
// Arrows and chevrons
'arrow-right': '<path d="M4 12h15M13 6l6 6-6 6"/>',
'arrow-left': '<path d="M20 12H5M11 6l-6 6 6 6"/>',
'arrow-up': '<path d="M12 20V5M6 11l6-6 6 6"/>',
'arrow-down': '<path d="M12 4v15M6 13l6 6 6-6"/>',
'arrow-up-right': '<path d="M7 17 17 7M8 7h9v9"/>',
'chevron-right': '<path d="m9 6 6 6-6 6"/>',
'chevron-left': '<path d="m15 6-6 6 6 6"/>',
'chevron-down': '<path d="m6 9 6 6 6-6"/>',
'chevron-up': '<path d="m6 15 6-6 6 6"/>',
'chevrons-up-down': '<path d="m8 9 4-4 4 4M8 15l4 4 4-4"/>',
// Actions
check: '<path d="m5 12.5 4.5 4.5L19 7.5"/>',
'check-circle': '<circle cx="12" cy="12" r="9"/><path d="m8 12.3 2.8 2.7L16 9.6"/>',
plus: '<path d="M12 5v14M5 12h14"/>',
minus: '<path d="M5 12h14"/>',
x: '<path d="M6 6l12 12M18 6 6 18"/>',
menu: '<path d="M4 7h16M4 12h16M4 17h16"/>',
search: '<circle cx="11" cy="11" r="6.5"/><path d="m16 16 4 4"/>',
'more-horizontal': '<circle cx="5.5" cy="12" r="1.2"/><circle cx="12" cy="12" r="1.2"/><circle cx="18.5" cy="12" r="1.2"/>',
copy: '<rect x="8.5" y="8.5" width="11" height="11" rx="2.5"/><path d="M15.5 8.5V6.5a2 2 0 0 0-2-2h-7a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h2"/>',
download: '<path d="M12 4v11M7 10.5l5 5 5-5M5 19.5h14"/>',
upload: '<path d="M12 16V5M7 9.5l5-5 5 5M5 19.5h14"/>',
external: '<path d="M13 5h6v6M19 5l-8 8M17 14v4a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 5 18V8.5A1.5 1.5 0 0 1 6.5 7H10"/>',
link: '<path d="M10 14a4 4 0 0 0 5.66 0l3-3a4 4 0 0 0-5.66-5.66l-1 1M14 10a4 4 0 0 0-5.66 0l-3 3a4 4 0 0 0 5.66 5.66l1-1"/>',
edit: '<path d="M15 5.5 18.5 9M5 19l1-4L16.2 4.8a1.6 1.6 0 0 1 2.3 0l.7.7a1.6 1.6 0 0 1 0 2.3L9 18z"/>',
trash: '<path d="M4.5 7h15M10 4h4M7 7l.8 11.2A1.9 1.9 0 0 0 9.7 20h4.6a1.9 1.9 0 0 0 1.9-1.8L17 7M10 11v5M14 11v5"/>',
refresh: '<path d="M19 12a7 7 0 1 1-2.05-4.95M19 4.5V8h-3.5"/>',
filter: '<path d="M4 6h16M7 12h10M10 18h4"/>',
sliders: '<path d="M4 7h9M17 7h3M4 17h3M11 17h9"/><circle cx="15" cy="7" r="2"/><circle cx="9" cy="17" r="2"/>',
'log-out': '<path d="M14 5H6.5A1.5 1.5 0 0 0 5 6.5v11A1.5 1.5 0 0 0 6.5 19H14M10 12h10M16.5 8.5 20 12l-3.5 3.5"/>',
send: '<path d="M4.5 12 19.5 5l-4 14-3.5-5.5zM12 13.5 19.5 5"/>',
// Objects
mail: '<rect x="3.5" y="5.5" width="17" height="13" rx="2.5"/><path d="m4.5 7.5 7.5 5.5 7.5-5.5"/>',
phone: '<rect x="7" y="3" width="10" height="18" rx="2.5"/><path d="M11 17.5h2"/>',
'map-pin': '<path d="M12 21c4-4.4 6.5-7.9 6.5-11.2a6.5 6.5 0 0 0-13 0C5.5 13.1 8 16.6 12 21Z"/><circle cx="12" cy="10" r="2.4"/>',
calendar: '<rect x="4" y="5.5" width="16" height="14.5" rx="2.5"/><path d="M4 10h16M8.5 3.5v4M15.5 3.5v4"/>',
clock: '<circle cx="12" cy="12" r="8.5"/><path d="M12 7.5V12l3 2"/>',
globe: '<circle cx="12" cy="12" r="8.5"/><path d="M3.5 12h17M12 3.5c2.4 2.4 3.5 5.2 3.5 8.5s-1.1 6.1-3.5 8.5c-2.4-2.4-3.5-5.2-3.5-8.5s1.1-6.1 3.5-8.5Z"/>',
home: '<path d="M4.5 10.5 12 4.5l7.5 6V19a1 1 0 0 1-1 1h-4v-5.5h-5V20h-4a1 1 0 0 1-1-1z"/>',
user: '<circle cx="12" cy="8.5" r="3.5"/><path d="M5 19.5c1-3.3 3.7-5 7-5s6 1.7 7 5"/>',
users: '<circle cx="9" cy="8.5" r="3.2"/><path d="M3 19c.9-3 3.2-4.6 6-4.6s5.1 1.6 6 4.6M15.5 5.6a3.2 3.2 0 0 1 0 5.8M17 14.7c2 .5 3.4 2 4 4.3"/>',
chat: '<path d="M5 18.5V7a2.5 2.5 0 0 1 2.5-2.5h9A2.5 2.5 0 0 1 19 7v6.5a2.5 2.5 0 0 1-2.5 2.5H8.5z"/><path d="M9 9.5h6M9 12.5h3.5"/>',
bell: '<path d="M6.5 16.5V11a5.5 5.5 0 0 1 11 0v5.5l1.5 1.5H5zM10 20.5h4"/>',
lock: '<rect x="5" y="10.5" width="14" height="10" rx="2.5"/><path d="M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5"/>',
key: '<circle cx="8.5" cy="15.5" r="4"/><path d="m11.5 12.5 8-8M16.5 7.5l2 2"/>',
eye: '<path d="M2.8 12C4.7 7.9 8 5.5 12 5.5s7.3 2.4 9.2 6.5c-1.9 4.1-5.2 6.5-9.2 6.5s-7.3-2.4-9.2-6.5Z"/><circle cx="12" cy="12" r="3"/>',
'eye-off': '<path d="M4 4l16 16M9.9 6A8.6 8.6 0 0 1 12 5.5c4 0 7.3 2.4 9.2 6.5a12 12 0 0 1-2.6 3.6M6.2 7.8A12 12 0 0 0 2.8 12c1.9 4.1 5.2 6.5 9.2 6.5 1.4 0 2.7-.3 3.9-.9M10 10.2a3 3 0 0 0 3.9 3.9"/>',
settings: '<circle cx="12" cy="12" r="3"/><path d="M12 3.5v2.2M12 18.3v2.2M20.5 12h-2.2M5.7 12H3.5M18 6l-1.6 1.6M7.6 16.4 6 18M18 18l-1.6-1.6M7.6 7.6 6 6"/>',
file: '<path d="M6.5 3.5h7l4 4V19a1.5 1.5 0 0 1-1.5 1.5H6.5A1.5 1.5 0 0 1 5 19V5a1.5 1.5 0 0 1 1.5-1.5Z"/><path d="M13.5 3.5V8h4M8.5 12.5h7M8.5 16h5"/>',
folder: '<path d="M3.5 7A1.5 1.5 0 0 1 5 5.5h4.3l2 2.2H19A1.5 1.5 0 0 1 20.5 9.2V17.5A1.5 1.5 0 0 1 19 19H5a1.5 1.5 0 0 1-1.5-1.5Z"/>',
image: '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><circle cx="9" cy="10" r="1.7"/><path d="m4.5 17.5 5-4.5 3.5 3 2.5-2 4 3.5"/>',
video: '<rect x="3.5" y="6" width="12.5" height="12" rx="2.5"/><path d="m16 10.5 4.5-2.5v8L16 13.5"/>',
play: '<path d="M8 5.8v12.4a.8.8 0 0 0 1.2.7l9.9-6.2a.8.8 0 0 0 0-1.4L9.2 5.1a.8.8 0 0 0-1.2.7Z"/>',
pause: '<path d="M9 5.5v13M15 5.5v13"/>',
code: '<path d="m9 7.5-4.5 4.5L9 16.5M15 7.5l4.5 4.5-4.5 4.5"/>',
terminal: '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="m7.5 9.5 3 2.5-3 2.5M12.5 15h4"/>',
layers: '<path d="m12 4 8.5 4.5L12 13 3.5 8.5Z"/><path d="m3.5 12.5 8.5 4.5 8.5-4.5M3.5 16.5 12 21l8.5-4.5"/>',
grid: '<rect x="4" y="4" width="6.5" height="6.5" rx="1.5"/><rect x="13.5" y="4" width="6.5" height="6.5" rx="1.5"/><rect x="4" y="13.5" width="6.5" height="6.5" rx="1.5"/><rect x="13.5" y="13.5" width="6.5" height="6.5" rx="1.5"/>',
cart: '<path d="M3.5 4.5h2.2l2.2 10.2a1.5 1.5 0 0 0 1.5 1.2h7.8a1.5 1.5 0 0 0 1.5-1.1l1.6-6.3H6.7"/><circle cx="10" cy="19.5" r="1.2"/><circle cx="17" cy="19.5" r="1.2"/>',
bag: '<path d="M5.5 8.5h13l-1 11a1.5 1.5 0 0 1-1.5 1.4H8a1.5 1.5 0 0 1-1.5-1.4Z"/><path d="M9 10V7a3 3 0 0 1 6 0v3"/>',
'credit-card': '<rect x="3.5" y="5.5" width="17" height="13" rx="2.5"/><path d="M3.5 10h17M7 15h3"/>',
quote: '<path d="M10 7.5H6.5A1.5 1.5 0 0 0 5 9v3.5h5V9.5M19 7.5h-3.5A1.5 1.5 0 0 0 14 9v3.5h5V9.5M10 12.5c0 2.6-1.4 4.2-4 4.5M19 12.5c0 2.6-1.4 4.2-4 4.5"/>',
info: '<circle cx="12" cy="12" r="8.5"/><path d="M12 11v5.5M12 7.8v.2"/>',
alert: '<path d="M10.7 4.6 3.4 17.3A1.5 1.5 0 0 0 4.7 19.5h14.6a1.5 1.5 0 0 0 1.3-2.2L13.3 4.6a1.5 1.5 0 0 0-2.6 0Z"/><path d="M12 9.5v4.5M12 16.7v.2"/>',
// Ideas and qualities
sparkle: '<path d="M12 3.5c.6 4.4 2.6 6.4 7 7-4.4.6-6.4 2.6-7 7-.6-4.4-2.6-6.4-7-7 4.4-.6 6.4-2.6 7-7Z"/><path d="M18.5 16.5c.2 1.4.8 2 2 2.2-1.2.2-1.8.8-2 2.2-.2-1.4-.8-2-2-2.2 1.2-.2 1.8-.8 2-2.2Z"/>',
star: '<path d="m12 4 2.47 5.01 5.53.8-4 3.9.94 5.5L12 16.6l-4.94 2.6.94-5.5-4-3.9 5.53-.8Z"/>',
heart: '<path d="M12 19.5s-7.5-4.4-7.5-10A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.5c0 5.6-7.5 10-7.5 10Z"/>',
bolt: '<path d="M13 3.5 5.5 13.5H12l-1 7 7.5-10H12Z"/>',
shield: '<path d="M12 3.5 19 6v5.5c0 4.4-2.9 7.6-7 9-4.1-1.4-7-4.6-7-9V6Z"/><path d="m9 12 2.2 2.2L15.5 10"/>',
target: '<circle cx="12" cy="12" r="8.5"/><circle cx="12" cy="12" r="5"/><circle cx="12" cy="12" r="1.5"/>',
'trending-up': '<path d="m3.5 17 6-6 4 4 7-7.5M15 7.5h5.5V13"/>',
'bar-chart': '<path d="M4 20h16M7 16.5v-5M12 16.5V6M17 16.5V10"/>',
rocket: '<path d="M14.5 4.5c2.6-.6 4.4-.5 5 0 .5.6.6 2.4 0 5-.8 3.4-3.6 6.5-7 8.5l-5.5-5.5c2-3.4 5.1-6.2 8.5-7Z"/><circle cx="14.5" cy="9.5" r="1.6"/><path d="M7 12.5 4 13l3.5-4.5M11.5 17l-.5 3 4.5-3.5M6.5 17.5l-2 2"/>',
cube: '<path d="m12 3.5 7.5 4.25v8.5L12 20.5l-7.5-4.25v-8.5Z"/><path d="m4.5 7.75 7.5 4.25 7.5-4.25M12 12v8.5"/>',
palette: '<path d="M12 3.5a8.5 8.5 0 0 0 0 17c1.1 0 1.6-.7 1.6-1.5 0-1.2-1-1.6-1-2.6s.8-1.6 1.9-1.6h2.1a3.9 3.9 0 0 0 3.9-3.9c0-4.2-3.8-7.4-8.5-7.4Z"/><circle cx="8" cy="11" r="1"/><circle cx="11" cy="7.5" r="1"/><circle cx="15.5" cy="8.5" r="1"/>',
gift: '<rect x="4" y="9" width="16" height="4" rx="1"/><path d="M5.5 13v6a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-6M12 9v11M12 9c-1.5-3.5-5-4-5-1.5C7 9 9 9 12 9Zm0 0c1.5-3.5 5-4 5-1.5C17 9 15 9 12 9Z"/>',
truck: '<path d="M3.5 6.5h10v10h-10zM13.5 10h4l3 3.5v3h-7"/><circle cx="7" cy="17.5" r="1.8"/><circle cx="17" cy="17.5" r="1.8"/>',
package: '<path d="m12 3.5 8 4.2v8.6L12 20.5l-8-4.2V7.7Z"/><path d="m4 7.7 8 4.3 8-4.3M12 12v8.5M8 5.6l8 4.3"/>',
// Theme and interface
sun: '<circle cx="12" cy="12" r="3.6"/><path d="M12 3.5v1.8M12 18.7v1.8M20.5 12h-1.8M5.3 12H3.5M18 6l-1.3 1.3M7.3 16.7 6 18M18 18l-1.3-1.3M7.3 7.3 6 6"/>',
moon: '<path d="M19.5 14.5A7.5 7.5 0 0 1 9.5 4.5a7.5 7.5 0 1 0 10 10Z"/>',
monitor: '<rect x="3.5" y="4.5" width="17" height="11.5" rx="2"/><path d="M9 20h6M12 16v4"/>',
tablet: '<rect x="5.5" y="3" width="13" height="18" rx="2.5"/><path d="M11 17.5h2"/>',
languages: '<path d="M4 6h8M8 4.5V6c0 3.6-1.8 6.4-4 7.5M5.8 9.5c1 1.8 2.6 3.2 4.7 4M12.5 20l3.5-8.5 3.5 8.5M13.7 17.3h4.6"/>',
'panel-left': '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="M9.5 4.5v15"/>',
inbox: '<path d="M4 13.5 6.3 6a1.5 1.5 0 0 1 1.4-1h8.6a1.5 1.5 0 0 1 1.4 1L20 13.5V18a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18Z"/><path d="M4 13.5h4.5l1 2h5l1-2H20"/>',
'loader': '<path d="M12 3.5a8.5 8.5 0 1 0 8.5 8.5"/>',
// App screens (navbar, auth, dashboard, chat, calendar)
fingerprint: '<path d="M8.5 5.2A7.5 7.5 0 0 1 19.5 12v1.5M4.5 15.5V12a7.4 7.4 0 0 1 1.6-4.6M12 8a4 4 0 0 1 4 4v2.5c0 2-.5 3.9-1.4 5.5M8 12a4 4 0 0 1 1.2-2.8M8 15c0 2-.7 3.6-1.8 4.8M12 12v3.2c0 2.3-.8 4.4-2.1 5.8"/>',
mic: '<rect x="9" y="3.5" width="6" height="11" rx="3"/><path d="M5.5 11.5a6.5 6.5 0 0 0 13 0M12 18v2.5"/>',
paperclip: '<path d="m19 11.5-7.1 7.1a4.5 4.5 0 0 1-6.4-6.4l7.4-7.4a3 3 0 0 1 4.2 4.2l-7.3 7.3a1.5 1.5 0 0 1-2.1-2.1l6.6-6.6"/>',
stop: '<rect x="6.5" y="6.5" width="11" height="11" rx="2"/>',
'thumbs-up': '<path d="M7.5 10.5v9h-3v-9zM7.5 10.5 11 4a2 2 0 0 1 2.5 2.3l-.6 3.2h5a1.8 1.8 0 0 1 1.8 2.1l-1.2 6.4a1.8 1.8 0 0 1-1.8 1.5H7.5"/>',
'thumbs-down': '<path d="M7.5 13.5v-9h-3v9zM7.5 13.5 11 20a2 2 0 0 0 2.5-2.3l-.6-3.2h5a1.8 1.8 0 0 0 1.8-2.1l-1.2-6.4a1.8 1.8 0 0 0-1.8-1.5H7.5"/>',
command: '<path d="M9 9V6.5A2.5 2.5 0 1 0 6.5 9H9Zm0 0h6m-6 0v6m6-6V6.5A2.5 2.5 0 1 1 17.5 9H15Zm0 0v6m0 0H9m6 0v2.5a2.5 2.5 0 1 0 2.5-2.5H15Zm-6 0v2.5A2.5 2.5 0 1 1 6.5 15H9Z"/>',
'help-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M9.6 9.5a2.5 2.5 0 0 1 4.8.9c0 1.7-2.4 2.2-2.4 3.6M12 16.8v.2"/>',
'chevrons-left': '<path d="m12 6-6 6 6 6M18 6l-6 6 6 6"/>',
'chevrons-right': '<path d="m6 6 6 6-6 6M12 6l6 6-6 6"/>',
activity: '<path d="M3.5 12h4l2.5-6 4 12 2.5-6h4"/>',
wallet: '<path d="M19 8.5v-2A1.5 1.5 0 0 0 17.5 5h-12A1.5 1.5 0 0 0 4 6.5v11A1.5 1.5 0 0 0 5.5 19h13a1.5 1.5 0 0 0 1.5-1.5V10a1.5 1.5 0 0 0-1.5-1.5H4"/><circle cx="16" cy="13.75" r="1"/>',
kanban: '<rect x="4" y="4" width="4.5" height="13" rx="1.5"/><rect x="9.75" y="4" width="4.5" height="9" rx="1.5"/><rect x="15.5" y="4" width="4.5" height="16" rx="1.5"/>',
'pie-chart': '<path d="M12 3.5V12h8.5A8.5 8.5 0 0 0 12 3.5Z"/><path d="M19.2 15.5A8.5 8.5 0 1 1 8.5 4.3"/>',
receipt: '<path d="M6 3.5h12v17l-2.5-1.5-2 1.5-1.5-1.2-1.5 1.2-2-1.5L6 20.5Z"/><path d="M9 8h6M9 11.5h6M9 15h3.5"/>',
'arrow-down-right': '<path d="M7 7l10 10M17 8v9H8"/>',
'trending-down': '<path d="m3.5 7 6 6 4-4 7 7.5M15 16.5h5.5V11"/>',
circle: '<circle cx="12" cy="12" r="8.5"/>',
hash: '<path d="M9.5 4 8 20M16 4l-1.5 16M4.5 9H20M4 15h15.5"/>',
book: '<path d="M5 19V5.5A1.5 1.5 0 0 1 6.5 4H19v13.5H6.5A1.5 1.5 0 0 0 5 19Zm0 0a1.5 1.5 0 0 0 1.5 1.5H19v-3"/>',
'user-plus': '<circle cx="10" cy="8.5" r="3.5"/><path d="M3.5 19.5c1-3.3 3.5-5 6.5-5 1.6 0 3 .5 4.2 1.4M18 13v6M15 16h6"/>',
'at-sign': '<circle cx="12" cy="12" r="3.5"/><path d="M15.5 12v1.3a2.4 2.4 0 0 0 4.8 0V12a8.5 8.5 0 1 0-3.3 6.7"/>',
archive: '<rect x="3.5" y="4.5" width="17" height="4" rx="1"/><path d="M5 8.5v10A1.5 1.5 0 0 0 6.5 20h11a1.5 1.5 0 0 0 1.5-1.5v-10M10 12.5h4"/>',
pin: '<path d="M9 4h6M10 4v5.5L7 13h10l-3-3.5V4M12 13v7.5"/>',
database: '<ellipse cx="12" cy="6" rx="7" ry="2.5"/><path d="M5 6v12c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5V6M5 12c0 1.4 3.1 2.5 7 2.5s7-1.1 7-2.5"/>',
volume: '<path d="M4.5 9.5h3l4.5-4v13l-4.5-4h-3z"/><path d="M15.5 9a4 4 0 0 1 0 6M18 6.5a7.5 7.5 0 0 1 0 11"/>',
grip: '<path d="M9 6.5h.01M15 6.5h.01M9 12h.01M15 12h.01M9 17.5h.01M15 17.5h.01"/>',
'mail-open': '<path d="M3.5 10 12 4.5l8.5 5.5V18a1.5 1.5 0 0 1-1.5 1.5H5A1.5 1.5 0 0 1 3.5 18Z"/><path d="m3.5 10 8.5 5.5 8.5-5.5"/>',
'log-in': '<path d="M10 5h7.5A1.5 1.5 0 0 1 19 6.5v11a1.5 1.5 0 0 1-1.5 1.5H10M4 12h10M10.5 8.5 14 12l-3.5 3.5"/>',
'calendar-check': '<rect x="4" y="5.5" width="16" height="14.5" rx="2.5"/><path d="M4 10h16M8.5 3.5v4M15.5 3.5v4M9 14.8l2 2 4-4"/>',
// Elements (buttons, forms, overlays, navigation)
'alert-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M12 7.8v5M12 16v.2"/>',
'bold': '<path d="M7.5 5h5.25a3.5 3.5 0 0 1 0 7H7.5zM7.5 12h6a3.5 3.5 0 0 1 0 7h-6z"/>',
'italic': '<path d="M10.5 5H17M7 19h6.5M14 5l-4 14"/>',
'underline': '<path d="M7.5 4.5V11a4.5 4.5 0 0 0 9 0V4.5M6 19.5h12"/>',
'align-left': '<path d="M4 6h16M4 10h10M4 14h16M4 18h10"/>',
'align-center': '<path d="M4 6h16M7 10h10M4 14h16M7 18h10"/>',
'align-right': '<path d="M4 6h16M10 10h10M4 14h16M10 18h10"/>',
'corner-down-left': '<path d="M19 5v6.5a2.5 2.5 0 0 1-2.5 2.5H5M9 10l-4 4 4 4"/>',
'more-vertical': '<circle cx="12" cy="5.5" r="1.2"/><circle cx="12" cy="12" r="1.2"/><circle cx="12" cy="18.5" r="1.2"/>',
'cloud-upload': '<path d="M7.5 18.5a4.5 4.5 0 0 1-.9-8.9 5.8 5.8 0 0 1 11.2-.3 4.3 4.3 0 0 1-.3 8.7M12 12.5v8M9 15.5l3-3 3 3"/>',
'printer': '<path d="M7 8.5v-4h10v4M7 17H5.5A1.5 1.5 0 0 1 4 15.5V10a1.5 1.5 0 0 1 1.5-1.5h13A1.5 1.5 0 0 1 20 10v5.5a1.5 1.5 0 0 1-1.5 1.5H17M7 14h10v6H7z"/>',
// Content blocks (blog, gallery, team, about, contact, error pages)
'wifi-off': '<path d="M3.5 9.3a12.5 12.5 0 0 1 17 0M6.3 12.8a8.2 8.2 0 0 1 11.4 0M9.2 16.2a4 4 0 0 1 5.6 0M12 19.5v.1M4.5 4.5l15 15"/>',
wrench: '<path d="M14.8 4.2a4.6 4.6 0 0 0-5.3 6L4.2 15.5a2.2 2.2 0 0 0 3.1 3.1l5.3-5.3a4.6 4.6 0 0 0 6-5.3l-2.8 2.8-2.6-.5-.5-2.6Z"/>',
'book-open': '<path d="M12 6.8C10.2 5.5 7.7 4.8 4.5 4.8v12.9c3.2 0 5.7.7 7.5 2 1.8-1.3 4.3-2 7.5-2V4.8c-3.2 0-5.7.7-7.5 2ZM12 6.8v12.9"/>',
bookmark: '<path d="M7 4.5h10a1 1 0 0 1 1 1v14.2l-6-4-6 4V5.5a1 1 0 0 1 1-1Z"/>',
share: '<circle cx="17.5" cy="6" r="2.5"/><circle cx="6.5" cy="12" r="2.5"/><circle cx="17.5" cy="18" r="2.5"/><path d="m8.7 10.8 6.6-3.6M8.7 13.2l6.6 3.6"/>',
expand: '<path d="M14.5 4.5h5v5M9.5 19.5h-5v-5M19.5 4.5 14 10M4.5 19.5 10 14"/>',
building: '<path d="M5 20.5V5a1.5 1.5 0 0 1 1.5-1.5h7A1.5 1.5 0 0 1 15 5v15.5M15 9.5h3a1.5 1.5 0 0 1 1.5 1.5v9.5M3.5 20.5h17M8.5 7.5h3M8.5 11h3M8.5 14.5h3"/>',
briefcase: '<rect x="3.5" y="7" width="17" height="12.5" rx="2.5"/><path d="M9 7V5.5A1.5 1.5 0 0 1 10.5 4h3A1.5 1.5 0 0 1 15 5.5V7M3.5 12.5h17"/>',
headset: '<path d="M4.5 14v-2a7.5 7.5 0 0 1 15 0v2"/><rect x="4" y="13" width="4" height="6" rx="1.5"/><rect x="16" y="13" width="4" height="6" rx="1.5"/><path d="M18 19c0 1.2-1.3 2-3.5 2H13"/>',
list: '<path d="M9 6.5h11M9 12h11M9 17.5h11M4.5 6.5h.1M4.5 12h.1M4.5 17.5h.1"/>',
flag: '<path d="M5.5 20.5v-16M5.5 4.5h11l-2 4 2 4h-11"/>',
'x-circle': '<circle cx="12" cy="12" r="8.5"/><path d="m9.2 9.2 5.6 5.6M14.8 9.2l-5.6 5.6"/>',
server: '<rect x="4" y="4.5" width="16" height="6.5" rx="2"/><rect x="4" y="13" width="16" height="6.5" rx="2"/><path d="M7.5 7.75h.1M7.5 16.25h.1M11 7.75h5.5M11 16.25h5.5"/>',
plug: '<path d="M9 3.5V8M15 3.5V8M6.5 8h11v3a5.5 5.5 0 0 1-11 0ZM12 16.5v4"/>',
leaf: '<path d="M5 19c0-8 5-13.5 14.5-14 .3 9.5-5.5 14.5-13 14Z"/><path d="M5 19c3-4 6-6.5 9.5-8.5"/>',
compass: '<circle cx="12" cy="12" r="8.5"/><path d="m15.5 8.5-2 5-5 2 2-5Z"/>',
// Marketing B (pricing, testimonials, cta, faq, newsletter, banners, popups)
repeat: '<path d="M17 3.5 20 6.5l-3 3M4 11.5v-1a4 4 0 0 1 4-4h12M7 20.5l-3-3 3-3M20 12.5v1a4 4 0 0 1-4 4H4"/>',
cookie: '<path d="M20.4 12.6a8.5 8.5 0 1 1-9-9 3 3 0 0 0 3.6 3.6 3 3 0 0 0 5.4 5.4Z"/><path d="M8.5 9.5h.01M8 14.5h.01M12.5 16.5h.01M12 12h.01M16 15.5h.01"/>',
tag: '<path d="M3.5 12.1V5A1.5 1.5 0 0 1 5 3.5h7.1a1.5 1.5 0 0 1 1.06.44l7.2 7.2a1.5 1.5 0 0 1 0 2.12l-7.1 7.1a1.5 1.5 0 0 1-2.12 0l-7.2-7.2a1.5 1.5 0 0 1-.44-1.06Z"/><circle cx="8.5" cy="8.5" r="1.5"/>',
megaphone: '<path d="M4 10v4a1.5 1.5 0 0 0 1.5 1.5H8l7.5 4V4.5L8 8.5H5.5A1.5 1.5 0 0 0 4 10ZM8 15.5l1.2 4.5M18.5 9.5a3 3 0 0 1 0 5"/>',
percent: '<path d="M18.5 5.5l-13 13"/><circle cx="7.5" cy="7.5" r="2.5"/><circle cx="16.5" cy="16.5" r="2.5"/>',
'qr-code': '<rect x="4" y="4" width="6" height="6" rx="1.2"/><rect x="14" y="4" width="6" height="6" rx="1.2"/><rect x="4" y="14" width="6" height="6" rx="1.2"/><path d="M14 14h2.5v2.5M20 14v.01M14 20h.01M17.5 20H20v-3"/>',
// More arrows
'arrow-down-left': '<path d="M17 7 7 17M16 17H7V8"/>',
'arrow-up-left': '<path d="M17 17 7 7M7 16V7h9"/>',
'arrow-right-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M8 12h7.5M12.5 8.5 16 12l-3.5 3.5"/>',
'arrows-left-right': '<path d="M4 8.5h15M15.5 5l3.5 3.5-3.5 3.5M20 15.5H5M8.5 12 5 15.5 8.5 19"/>',
'arrows-up-down': '<path d="M8.5 19.5v-15M5 8l3.5-3.5L12 8M15.5 4.5v15M12 16l3.5 3.5L19 16"/>',
undo: '<path d="M9 13.5 4.5 9 9 4.5M4.5 9H15a5 5 0 0 1 0 10h-3.5"/>',
redo: '<path d="M15 13.5 19.5 9 15 4.5M19.5 9H9a5 5 0 0 0 0 10h3.5"/>',
'rotate-ccw': '<path d="M4.5 12a7.5 7.5 0 1 0 2.2-5.3M4.5 4.5V9H9"/>',
maximize: '<path d="M14.5 4.5h5v5M9.5 19.5h-5v-5M19.5 4.5l-6 6M4.5 19.5l6-6"/>',
minimize: '<path d="m19.5 4.5-5.5 5.5M14 5.5V10h4.5M4.5 19.5l5.5-5.5M10 18.5V14H5.5"/>',
move: '<path d="M12 3.5v17M3.5 12h17M9.5 6 12 3.5 14.5 6M9.5 18l2.5 2.5 2.5-2.5M6 9.5 3.5 12 6 14.5M18 9.5l2.5 2.5-2.5 2.5"/>',
route: '<circle cx="6" cy="18" r="2"/><circle cx="18" cy="6" r="2"/><path d="M8 18h7.5a3 3 0 0 0 0-6h-7a3 3 0 0 1 0-6H16"/>',
// More actions
'plus-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M12 8.5v7M8.5 12h7"/>',
'minus-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M8.5 12h7"/>',
'check-square': '<rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.2 12.3 2.6 2.6 5-5.4"/>',
'share-out': '<path d="M12 15V3.5M8 7.5l4-4 4 4M8 10.5H6.5A1.5 1.5 0 0 0 5 12v7a1.5 1.5 0 0 0 1.5 1.5h11A1.5 1.5 0 0 0 19 19v-7a1.5 1.5 0 0 0-1.5-1.5H16"/>',
'zoom-in': '<circle cx="11" cy="11" r="6.5"/><path d="m16 16 4 4M11 8.5v5M8.5 11h5"/>',
'zoom-out': '<circle cx="11" cy="11" r="6.5"/><path d="m16 16 4 4M8.5 11h5"/>',
power: '<path d="M12 4.3v7.5M7.2 7.3a7 7 0 1 0 9.6 0"/>',
unlock: '<rect x="5" y="10.5" width="14" height="10" rx="2.5"/><path d="M8.5 10.5V8a3.5 3.5 0 0 1 6.8-1.2"/>',
reply: '<path d="M9.5 6.5 4.5 11l5 4.5M4.5 11H13a6 6 0 0 1 6 6v1.5"/>',
'list-checks': '<path d="M12 7h8M12 12h8M12 17h8M4 7l1.5 1.5L8.5 5.5M4 16l1.5 1.5 3-3"/>',
type: '<path d="M5 7.5V5h14v2.5M12 5v14M9.5 19h5"/>',
layout: '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="M3.5 9.5h17M10 9.5v10"/>',
columns: '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="M12 4.5v15"/>',
'panel-right': '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="M14.5 4.5v15"/>',
table: '<rect x="3.5" y="4.5" width="17" height="15" rx="2.5"/><path d="M3.5 9.5h17M3.5 14.5h17M9.5 9.5v10"/>',
toggle: '<rect x="2.5" y="7" width="19" height="10" rx="5"/><circle cx="16.5" cy="12" r="2.5"/>',
history: '<path d="M4.5 12a7.5 7.5 0 1 0 2.2-5.3M4.5 4.5V9H9M12 8.5V12l2.8 1.8"/>',
hourglass: '<path d="M6.5 3.5h11M6.5 20.5h11M7.5 3.5c0 4 4.5 5.3 4.5 8.5s-4.5 4.5-4.5 8.5M16.5 3.5c0 4-4.5 5.3-4.5 8.5s4.5 4.5 4.5 8.5"/>',
timer: '<circle cx="12" cy="13" r="7.5"/><path d="M12 13V9.5M9.5 3h5M18.3 6.7l1.2-1.2"/>',
// Files
'file-plus': '<path d="M6.5 3.5h7l4 4V19a1.5 1.5 0 0 1-1.5 1.5H6.5A1.5 1.5 0 0 1 5 19V5a1.5 1.5 0 0 1 1.5-1.5Z"/><path d="M13.5 3.5V8h4M11.25 11.5v5M8.75 14h5"/>',
'file-check': '<path d="M6.5 3.5h7l4 4V19a1.5 1.5 0 0 1-1.5 1.5H6.5A1.5 1.5 0 0 1 5 19V5a1.5 1.5 0 0 1 1.5-1.5Z"/><path d="M13.5 3.5V8h4M8.6 14.2l1.9 1.9 3.6-3.8"/>',
'file-code': '<path d="M6.5 3.5h7l4 4V19a1.5 1.5 0 0 1-1.5 1.5H6.5A1.5 1.5 0 0 1 5 19V5a1.5 1.5 0 0 1 1.5-1.5Z"/><path d="M13.5 3.5V8h4M9.7 12 7.9 14l1.8 2M12.8 12l1.8 2-1.8 2"/>',
files: '<path d="M8.5 3.5h6L18 7v8a1.5 1.5 0 0 1-1.5 1.5h-8A1.5 1.5 0 0 1 7 15V5a1.5 1.5 0 0 1 1.5-1.5Z"/><path d="M14.5 3.5V7H18M7 7.5h-.5A1.5 1.5 0 0 0 5 9v10a1.5 1.5 0 0 0 1.5 1.5h7A1.5 1.5 0 0 0 15 19v-2.5"/>',
'folder-open': '<path d="M3.5 17.5V7A1.5 1.5 0 0 1 5 5.5h4.3l2 2.2H17a1.5 1.5 0 0 1 1.5 1.5v1.3"/><path d="M3.5 17.5 6 11.6a1.5 1.5 0 0 1 1.4-1.1H20a1 1 0 0 1 .9 1.4L18.4 18a1.5 1.5 0 0 1-1.4 1H5a1.5 1.5 0 0 1-1.5-1.5Z"/>',
'folder-plus': '<path d="M3.5 7A1.5 1.5 0 0 1 5 5.5h4.3l2 2.2H19a1.5 1.5 0 0 1 1.5 1.5v8.3A1.5 1.5 0 0 1 19 19H5a1.5 1.5 0 0 1-1.5-1.5Z"/><path d="M12 10.6v5.5M9.25 13.35h5.5"/>',
clipboard: '<rect x="5.5" y="5" width="13" height="16" rx="2"/><rect x="9" y="3" width="6" height="4" rx="1"/><path d="M9 12h6M9 15.5h4"/>',
'hard-drive': '<rect x="3.5" y="13" width="17" height="6.5" rx="2"/><path d="M3.5 15 6.6 6a1.5 1.5 0 0 1 1.4-1h8a1.5 1.5 0 0 1 1.4 1l3.1 9M7.5 16.25h.01M10.5 16.25h.01"/>',
cloud: '<path d="M7.2 18h9a4 4 0 0 0 .4-8 5 5 0 0 0-9.7 1.1A3.5 3.5 0 0 0 7.2 18Z"/>',
// Communication
'message-circle': '<path d="M20 11.5a8 8 0 0 1-11.8 7L4 19.5l1.1-3.9A8 8 0 1 1 20 11.5Z"/>',
chats: '<path d="M14.5 9.5h3A2.5 2.5 0 0 1 20 12v8l-3-2.5h-4.5A2.5 2.5 0 0 1 10 15v-.5"/><path d="M4 7a2.5 2.5 0 0 1 2.5-2.5H12A2.5 2.5 0 0 1 14.5 7v5a2.5 2.5 0 0 1-2.5 2.5H7L4 17Z"/>',
'phone-call': '<path d="M8.6 4.5H6.2a1.7 1.7 0 0 0-1.7 1.8c.3 7.3 5.9 12.9 13.2 13.2a1.7 1.7 0 0 0 1.8-1.7v-2.4a1 1 0 0 0-.7-1l-3-1a1 1 0 0 0-1.1.3l-1.3 1.6a12 12 0 0 1-5-5l1.6-1.3a1 1 0 0 0 .3-1.1l-1-3a1 1 0 0 0-.7-.4Z"/>',
rss: '<path d="M5 11a8 8 0 0 1 8 8M5 5a14 14 0 0 1 14 14"/><circle cx="6" cy="18" r="1.3"/>',
// Media
music: '<path d="M9 17.5v-12l10-2v12"/><circle cx="6.5" cy="17.5" r="2.5"/><circle cx="16.5" cy="15.5" r="2.5"/>',
'volume-x': '<path d="M4.5 9.5v5H8l4.5 4v-13L8 9.5Z"/><path d="m15.5 9.5 5 5M20.5 9.5l-5 5"/>',
headphones: '<path d="M4.5 17v-4.5a7.5 7.5 0 0 1 15 0V17"/><rect x="4.5" y="13.5" width="4" height="6.5" rx="1.5"/><rect x="15.5" y="13.5" width="4" height="6.5" rx="1.5"/>',
camera: '<path d="M4 8.5A1.5 1.5 0 0 1 5.5 7h2.2l1.5-2h5.6l1.5 2h2.2A1.5 1.5 0 0 1 20 8.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 17.5Z"/><circle cx="12" cy="12.75" r="3.25"/>',
film: '<rect x="4" y="3.5" width="16" height="17" rx="2.5"/><path d="M8 3.5v17M16 3.5v17M4 8h4M4 12h16M4 16h4M16 8h4M16 16h4"/>',
'skip-forward': '<path d="M6 6.5v11l8-5.5Z"/><path d="M17.5 6v12"/>',
'skip-back': '<path d="M18 6.5v11L10 12Z"/><path d="M6.5 6v12"/>',
'play-circle': '<circle cx="12" cy="12" r="8.5"/><path d="M10 8.8v6.4a.6.6 0 0 0 .9.5l5-3.2a.6.6 0 0 0 0-1l-5-3.2a.6.6 0 0 0-.9.5Z"/>',
shuffle: '<path d="M4 7h3.2a3 3 0 0 1 2.5 1.3l4.6 7.4a3 3 0 0 0 2.5 1.3H20M4 17h3.2a3 3 0 0 0 2.5-1.3l.6-1M13.7 9.3l.6-1A3 3 0 0 1 16.8 7H20M17.5 4.5 20 7l-2.5 2.5M17.5 14.5 20 17l-2.5 2.5"/>',
captions: '<rect x="3.5" y="5.5" width="17" height="13" rx="2.5"/><path d="M7 12.5h3M12.5 12.5H17M7 15.5h6M15.5 15.5H17"/>',
// Commerce
store: '<path d="M4 9.5 5.5 4.5h13L20 9.5M4 9.5a2.67 2.67 0 0 0 5.33 0 2.67 2.67 0 0 0 5.34 0 2.67 2.67 0 0 0 5.33 0M5.5 12v7.5h13V12M10 19.5v-4h4v4"/>',
coins: '<ellipse cx="9" cy="7" rx="5" ry="2.5"/><path d="M4 7v4c0 1.4 2.2 2.5 5 2.5M4 11v4c0 1.4 2.2 2.5 5 2.5"/><ellipse cx="15" cy="13" rx="5" ry="2.5"/><path d="M10 13v4c0 1.4 2.2 2.5 5 2.5s5-1.1 5-2.5v-4"/>',
banknote: '<rect x="3" y="6.5" width="18" height="11" rx="2"/><circle cx="12" cy="12" r="2.5"/><path d="M6.5 12h.01M17.5 12h.01"/>',
scan: '<path d="M4 8V5.5A1.5 1.5 0 0 1 5.5 4H8M16 4h2.5A1.5 1.5 0 0 1 20 5.5V8M20 16v2.5a1.5 1.5 0 0 1-1.5 1.5H16M8 20H5.5A1.5 1.5 0 0 1 4 18.5V16M8 8.5v7M11 8.5v7M13.5 8.5v7M16 8.5v7"/>',
euro: '<path d="M18.5 6.5a6.5 6.5 0 1 0 0 11M5.5 10.5h9M5.5 13.5h9"/>',
dollar: '<path d="M12 3.5v17M16.5 7.5c-.6-1.4-2.3-2.3-4.5-2.3-2.6 0-4.3 1.3-4.3 3.2 0 4.4 9 2.4 9 6.9 0 2-1.9 3.4-4.7 3.4-2.3 0-4-1-4.7-2.6"/>',
'badge-percent': '<path d="M12 3.5 14.4 5l2.8-.1.9 2.7 2.3 1.6-.9 2.7.9 2.7-2.3 1.6-.9 2.7-2.8-.1L12 20.5 9.6 19l-2.8.1-.9-2.7-2.3-1.6.9-2.7-.9-2.7 2.3-1.6.9-2.7 2.8.1Z"/><path d="m9.5 14.5 5-5M9.7 9.7h.01M14.3 14.3h.01"/>',
crown: '<path d="M4 8.5 7.5 12 12 5.5l4.5 6.5L20 8.5 18.5 17h-13ZM5.5 20h13"/>',
gem: '<path d="M7 4.5h10l3.5 5L12 20 3.5 9.5ZM3.5 9.5h17M9.5 4.5l-1 5L12 20M14.5 4.5l1 5L12 20"/>',
// Devices
laptop: '<rect x="5" y="5" width="14" height="10.5" rx="1.5"/><path d="M2.5 18.5h19"/>',
watch: '<rect x="6.5" y="6.5" width="11" height="11" rx="3"/><path d="M9 6.5l.5-3h5l.5 3M9 17.5l.5 3h5l.5-3M12 9.5V12l1.5 1"/>',
keyboard: '<rect x="2.5" y="6" width="19" height="12" rx="2.5"/><path d="M6 9.75h.01M10 9.75h.01M14 9.75h.01M18 9.75h.01M6 14.25h.01M18 14.25h.01M9 14.25h6"/>',
mouse: '<rect x="6.5" y="3.5" width="11" height="17" rx="5.5"/><path d="M12 7v3"/>',
cpu: '<rect x="6.5" y="6.5" width="11" height="11" rx="2"/><rect x="9.5" y="9.5" width="5" height="5" rx="1"/><path d="M9.5 3.5v3M14.5 3.5v3M9.5 17.5v3M14.5 17.5v3M3.5 9.5h3M3.5 14.5h3M17.5 9.5h3M17.5 14.5h3"/>',
battery: '<rect x="3" y="7.5" width="16" height="9" rx="2.5"/><path d="M21 10.5v3M6.5 10.5v3M9.5 10.5v3"/>',
wifi: '<path d="M2.5 9a13.5 13.5 0 0 1 19 0M5.5 12.3a9 9 0 0 1 13 0M8.6 15.5a4.6 4.6 0 0 1 6.8 0"/><path d="M12 19h.01"/>',
bluetooth: '<path d="m7 7.5 10 9-5 4.5V3l5 4.5-10 9"/>',
tv: '<rect x="3" y="7" width="18" height="12.5" rx="2.5"/><path d="m8.5 3.5 3.5 3.5 3.5-3.5"/>',
gamepad: '<path d="M7 7h10a4.5 4.5 0 0 1 4.4 5.4l-.9 4.4a2.5 2.5 0 0 1-4.3 1.2L14 15.5h-4L7.8 18a2.5 2.5 0 0 1-4.3-1.2l-.9-4.4A4.5 4.5 0 0 1 7 7Z"/><path d="M7.5 10v3M6 11.5h3M15.5 11.5h.01M17.5 11.5h.01"/>',
// Weather and nature
'cloud-rain': '<path d="M7.2 16h9a4 4 0 0 0 .4-8 5 5 0 0 0-9.7 1.1A3.5 3.5 0 0 0 7.2 16Z"/><path d="m8.5 18.5-1 2M12.5 18.5l-1 2M16.5 18.5l-1 2"/>',
snowflake: '<path d="M12 3.5v17M4.6 7.75l14.8 8.5M4.6 16.25l14.8-8.5M9.5 4.5 12 6.5l2.5-2M9.5 19.5 12 17.5l2.5 2"/>',
wind: '<path d="M3.5 9h11a2.5 2.5 0 1 0-2.5-2.5M3.5 15h14a2.5 2.5 0 1 1-2.5 2.5M3.5 12h16"/>',
droplet: '<path d="M12 3.5c3.5 4.2 6 7.3 6 10.5a6 6 0 0 1-12 0c0-3.2 2.5-6.3 6-10.5Z"/>',
sprout: '<path d="M12 20.5V11M12 11c0-3.5-2.5-6-6.5-6 0 3.5 2.5 6 6.5 6ZM12 13.5c0-3 2.2-5 6.5-5 0 3-2.2 5-6.5 5Z"/>',
tree: '<path d="M12 21v-5M12 3.5 6 11h2.5L5 16h14l-3.5-5H18Z"/>',
mountain: '<path d="M3 19 9.5 6l4 7.5 2.2-3.5L21 19Z"/>',
thermometer: '<path d="M14.5 13.6V5.5a2.5 2.5 0 0 0-5 0v8.1a4 4 0 1 0 5 0Z"/><path d="M12 10v6.7"/>',
umbrella: '<path d="M3.5 12a8.5 8.5 0 0 1 17 0Z"/><path d="M12 12v6.5a2 2 0 0 1-4 0"/>',
flame: '<path d="M12 21a6.5 6.5 0 0 0 6.5-6.5c0-4-3-6.5-4.5-10.5-1.5 2.5-2 4-2 6-1-1-1.5-2-1.5-3.5C8 8.5 5.5 11 5.5 14.5A6.5 6.5 0 0 0 12 21Z"/>',
sunrise: '<path d="M7 16a5 5 0 0 1 10 0M3.5 19.5h17M12 4v5M9.5 6.5 12 4l2.5 2.5M4.8 11.2l1.4 1M19.2 11.2l-1.4 1"/>',
paw: '<circle cx="5.5" cy="10.5" r="1.8"/><circle cx="9.5" cy="6.5" r="1.8"/><circle cx="14.5" cy="6.5" r="1.8"/><circle cx="18.5" cy="10.5" r="1.8"/><path d="M12 11.5c2.3 0 5 3.4 5 5.6 0 1.6-1.3 2.4-2.6 2.4-1 0-1.6-.5-2.4-.5s-1.4.5-2.4.5C8.3 19.5 7 18.7 7 17.1c0-2.2 2.7-5.6 5-5.6Z"/>',
// Numbers and charts
'line-chart': '<path d="M4 4v16h16"/><path d="m7.5 14.5 3.5-4 3 2.5 4.5-5.5"/>',
'bar-chart-horizontal': '<path d="M4 4v16M7.5 7.5h6M7.5 12h11M7.5 16.5h8"/>',
gauge: '<path d="M4.5 18.5a8.5 8.5 0 1 1 15 0"/><path d="m12 15.5 3.5-4.5"/><circle cx="12" cy="16" r="1.2"/>',
calculator: '<rect x="5" y="3.5" width="14" height="17" rx="2.5"/><rect x="8" y="6.5" width="8" height="3" rx=".8"/><path d="M8.5 13h.01M12 13h.01M15.5 13h.01M8.5 16.5h.01M12 16.5h.01M15.5 16.5h.01"/>',
sigma: '<path d="M17.5 5.5h-11l6 6.5-6 6.5h11"/>',
infinity: '<path d="M12 12c-1.8-2.4-3.4-3.6-5-3.6a3.6 3.6 0 0 0 0 7.2c1.6 0 3.2-1.2 5-3.6s3.4-3.6 5-3.6a3.6 3.6 0 0 1 0 7.2c-1.6 0-3.2-1.2-5-3.6Z"/>',
// People
'user-check': '<circle cx="10" cy="8.5" r="3.5"/><path d="M3.5 19.5c1-3.3 3.4-5 6.5-5 1.5 0 2.8.4 3.8 1.1M15 17l2 2 3.5-4"/>',
'user-minus': '<circle cx="10" cy="8.5" r="3.5"/><path d="M3.5 19.5c1-3.3 3.4-5 6.5-5 1.5 0 2.8.4 3.8 1.1M15 16.5h6"/>',
'user-circle': '<circle cx="12" cy="12" r="8.5"/><circle cx="12" cy="10" r="3"/><path d="M6.5 18.3c1.2-1.9 3.2-3 5.5-3s4.3 1.1 5.5 3"/>',
'id-card': '<rect x="3" y="5" width="18" height="14" rx="2.5"/><circle cx="9" cy="11" r="2"/><path d="M5.8 16c.6-1.4 1.8-2.2 3.2-2.2s2.6.8 3.2 2.2M14.5 10H18M14.5 13.5H17"/>',
smile: '<circle cx="12" cy="12" r="8.5"/><path d="M8.5 14a4.5 4.5 0 0 0 7 0M9.2 9.3v.6M14.8 9.3v.6"/>',
accessibility: '<circle cx="12" cy="12" r="8.5"/><circle cx="12" cy="7.8" r="1.1"/><path d="m8 10.2 4 .8 4-.8M12 11v3l-2 3.5M12 14l2 3.5"/>',
// Places
landmark: '<path d="M3.5 9 12 4l8.5 5ZM5.5 9v8M9.8 9v8M14.2 9v8M18.5 9v8M3.5 20h17M4.5 17h15"/>',
map: '<path d="M3.5 6.5 9 4.5l6 2 5.5-2v13l-5.5 2-6-2-5.5 2Z"/><path d="M9 4.5v13M15 6.5v13"/>',
navigation: '<path d="M12 3.5 19 20l-7-3.5L5 20Z"/>',
locate: '<circle cx="12" cy="12" r="6.5"/><circle cx="12" cy="12" r="2"/><path d="M12 3v2.5M12 18.5V21M3 12h2.5M18.5 12H21"/>',
anchor: '<circle cx="12" cy="5.5" r="2"/><path d="M12 7.5v13M8.5 11h7M4.5 13a7.5 7.5 0 0 0 15 0"/>',
// Tools
scissors: '<circle cx="6.5" cy="7" r="2.5"/><circle cx="6.5" cy="17" r="2.5"/><path d="M8.6 8.4 20 17M8.6 15.6 20 7"/>',
brush: '<path d="m18.5 3.5-8.5 8.5 2 2 8.5-8.5a1.4 1.4 0 0 0-2-2Z"/><path d="M10 12c-2 0-3.5 1.3-3.5 3.2 0 1.6-.9 2.6-2.5 3.3 3 1.6 7.5.5 8-4.5Z"/>',
ruler: '<g transform="rotate(-45 12 12)"><rect x="3" y="8.5" width="18" height="7" rx="1.5"/><path d="M7 8.5V11M10 8.5V10M13 8.5V11M16 8.5V10"/></g>',
magnet: '<path d="M5.5 5v6.5a6.5 6.5 0 0 0 13 0V5h-4v6.5a2.5 2.5 0 0 1-5 0V5Z"/><path d="M5.5 9h4M14.5 9h4"/>',
puzzle: '<path d="M9 5.5H5a1 1 0 0 0-1 1v4a2 2 0 1 1 0 4v4a1 1 0 0 0 1 1h4a2 2 0 1 1 4 0h4a1 1 0 0 0 1-1v-4a2 2 0 1 0 0-4v-4a1 1 0 0 0-1-1h-4a2 2 0 1 0-4 0Z"/>',
wand: '<path d="m4.5 19.5 11-11M13.5 6.5l4 4M18 3.5v3M16.5 5h3M19.5 13v2M18.5 14h2M9.5 4v2M8.5 5h2"/>',
crop: '<path d="M7 3.5V17h13.5M3.5 7H17v13.5"/>',
eraser: '<path d="M8.5 19.5 4 15a1.5 1.5 0 0 1 0-2.1l9.4-9.4a1.5 1.5 0 0 1 2.1 0l5 5a1.5 1.5 0 0 1 0 2.1l-8.9 8.9ZM9 8l7 7M8.5 19.5h11"/>',
// Education
'graduation-cap': '<path d="M2.5 9.5 12 5l9.5 4.5L12 14Z"/><path d="M6.5 11.5v4c0 1.4 2.5 3 5.5 3s5.5-1.6 5.5-3v-4M21.5 9.5v5"/>',
lightbulb: '<path d="M9 17.5h6M10 20.5h4M9 17.5c0-2-3-3.5-3-7.5a6 6 0 0 1 12 0c0 4-3 5.5-3 7.5"/>',
award: '<circle cx="12" cy="9" r="5.5"/><path d="M8.8 13.5 7.5 20.5l4.5-2.5 4.5 2.5-1.3-7"/>',
trophy: '<path d="M7.5 4.5h9V10a4.5 4.5 0 0 1-9 0ZM7.5 6.5h-3V8a3 3 0 0 0 3 3M16.5 6.5h3V8a3 3 0 0 1-3 3M12 14.5v3M8.5 20.5h7M9.5 20.5c0-1.7 1.1-3 2.5-3s2.5 1.3 2.5 3"/>',
notebook: '<rect x="5.5" y="3.5" width="13" height="17" rx="2"/><path d="M9 3.5v17M3.5 7.5H7M3.5 12H7M3.5 16.5H7M12 8h3.5"/>',
flask: '<path d="M9.5 3.5h5M10 3.5V9l-5.2 9a1.6 1.6 0 0 0 1.4 2.5h11.6a1.6 1.6 0 0 0 1.4-2.5L14 9V3.5M7.5 14.5h9"/>',
glasses: '<circle cx="6.5" cy="14" r="3.5"/><circle cx="17.5" cy="14" r="3.5"/><path d="M10 13.5a2.5 2.5 0 0 1 4 0M3 13l2-5.5M21 13l-2-5.5"/>',
atom: '<circle cx="12" cy="12" r="1.3"/><ellipse cx="12" cy="12" rx="9" ry="3.6"/><ellipse cx="12" cy="12" rx="9" ry="3.6" transform="rotate(60 12 12)"/><ellipse cx="12" cy="12" rx="9" ry="3.6" transform="rotate(120 12 12)"/>',
presentation: '<path d="M3.5 4.5h17M5 4.5v10A1.5 1.5 0 0 0 6.5 16h11a1.5 1.5 0 0 0 1.5-1.5v-10M12 16v3M8.5 20.5 12 19l3.5 1.5M8.5 12 11 9.5l2 2 3-3"/>',
// Health
'heart-pulse': '<path d="M12 19.5s-7.5-4.4-7.5-10A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.5c0 5.6-7.5 10-7.5 10Z"/><path d="M4.8 12.5h3.7L10 10l2.5 4.5 1.5-2h5.2"/>',
pill: '<rect x="4" y="8.5" width="16" height="7" rx="3.5" transform="rotate(-45 12 12)"/><path d="m9.5 9.5 5 5"/>',
stethoscope: '<path d="M6 3.5H5a1 1 0 0 0-1 1V9a4.5 4.5 0 0 0 9 0V4.5a1 1 0 0 0-1-1h-1M8.5 13.5v1a5 5 0 0 0 10 0V12"/><circle cx="18.5" cy="10" r="2"/>',
medical: '<path d="M9.5 4.5h5v5h5v5h-5v5h-5v-5h-5v-5h5Z"/>',
dumbbell: '<rect x="5.5" y="6.5" width="3" height="11" rx="1"/><rect x="15.5" y="6.5" width="3" height="11" rx="1"/><path d="M8.5 12h7M3.5 9.5v5M20.5 9.5v5"/>',
tooth: '<path d="M12 6.5c-1.5-1.3-3-2-4.5-2-2.3 0-3.5 1.9-3.5 4.3 0 2.2.9 3.7 1.5 5.2.6 1.7.8 3.5 1.4 5.2.3.9.8 1.3 1.4 1.3 1.6 0 1.1-5 3.7-5s2.1 5 3.7 5c.6 0 1.1-.4 1.4-1.3.6-1.7.8-3.5 1.4-5.2.6-1.5 1.5-3 1.5-5.2 0-2.4-1.2-4.3-3.5-4.3-1.5 0-3 .7-4.5 2Z"/>',
// Food
coffee: '<path d="M4.5 9h11v5.5A5.5 5.5 0 0 1 10 20a5.5 5.5 0 0 1-5.5-5.5ZM15.5 10.5H17a2.5 2.5 0 0 1 0 5h-1.5M7.5 3.5V6M10 3.5V6M12.5 3.5V6"/>',
utensils: '<path d="M8.5 3.5v17M6 3.5V8a2.5 2.5 0 0 0 5 0V3.5M18 20.5v-17c-2.2 1-3.5 3.5-3.5 6.5V13H18"/>',
wine: '<path d="M8 3.5h8l.5 4.5a4.5 4.5 0 0 1-9 0ZM12 12.5v8M8.5 20.5h7M7.6 7.5h8.8"/>',
apple: '<path d="M12 7.5c-1-.9-2.3-1.3-3.6-1.1C5.9 6.8 4.5 9 4.5 11.8c0 4 2.8 8.7 5.3 8.7 1 0 1.4-.6 2.2-.6s1.2.6 2.2.6c2.5 0 5.3-4.7 5.3-8.7 0-2.8-1.4-5-3.9-5.4-1.3-.2-2.6.2-3.6 1.1ZM12 7.5c0-2 1-3.5 3-4"/>',
cake: '<path d="M4.5 20.5h15M5.5 20.5V13A1.5 1.5 0 0 1 7 11.5h10a1.5 1.5 0 0 1 1.5 1.5v7.5M5.5 15.5c1.1 0 1.6-1 2.6-1s1.6 1 2.6 1 1.6-1 2.6-1 1.6 1 2.6 1 1.6-1 2.6-1M12 11.5V9"/><path d="M12 8c-.8 0-1.3-.6-1.3-1.3 0-.9 1.3-2.2 1.3-2.2s1.3 1.3 1.3 2.2c0 .7-.5 1.3-1.3 1.3Z"/>',
pizza: '<path d="M12 20 3.8 5.8a16 16 0 0 1 16.4 0Z"/><path d="M5.3 8.4a13 13 0 0 1 13.4 0"/><circle cx="10.5" cy="11" r="1"/><circle cx="13.5" cy="14" r="1"/>',
'chef-hat': '<path d="M7.5 15.5a3.5 3.5 0 0 1-.4-7 5 5 0 0 1 9.8 0 3.5 3.5 0 0 1-.4 7V20h-9Z"/><path d="M7.5 17h9"/>',
soup: '<path d="M4 11h16a8 8 0 0 1-16 0ZM9 3.5c-.8 1 .8 2 0 3M12.5 3.5c-.8 1 .8 2 0 3M16 3.5c-.8 1 .8 2 0 3"/>',
'ice-cream': '<path d="M6.6 10.5a5.4 5.4 0 1 1 10.8 0"/><path d="M6 10.5h12l-6 10Z"/><path d="m9.3 15 4.4-4.5"/>',
// Travel
plane: '<path transform="rotate(45 12 12)" d="M12 3c1 0 1.5 1 1.5 2.5v4l6.5 4v2l-6.5-2V18l2 1.5V21L12 20l-3.5 1v-1.5l2-1.5v-4.5l-6.5 2v-2l6.5-4v-4C10.5 4 11 3 12 3Z"/>',
train: '<rect x="5.5" y="3.5" width="13" height="14" rx="3"/><path d="M5.5 11h13M9 14.5h.01M15 14.5h.01M8.5 20.5l1.5-3M15.5 20.5l-1.5-3"/>',
car: '<path d="M4 15.5v-4l1.8-4.6a1.5 1.5 0 0 1 1.4-.9h9.6a1.5 1.5 0 0 1 1.4.9L20 11.5v4a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1ZM4 11.5h16M7 16.5v2M17 16.5v2M7 14h1.5M15.5 14H17"/>',
bike: '<circle cx="6" cy="15.5" r="3.5"/><circle cx="18" cy="15.5" r="3.5"/><path d="M6 15.5 9 9h7l2 6.5M9 9l3 6.5H6M14.5 6.5H17l-1 2.5M8 7h2.5"/>',
bus: '<rect x="4.5" y="3.5" width="15" height="15" rx="3"/><path d="M4.5 11h15M8 15h.01M16 15h.01M7.5 18.5v2M16.5 18.5v2M8.5 6.5h7"/>',
ship: '<path d="M3.5 14.5h17l-2.3 4.5a1 1 0 0 1-.9.5H6.7a1 1 0 0 1-.9-.5ZM6.5 14.5v-4h11v4M9.5 10.5V7h5v3.5M12 7V4"/>',
luggage: '<rect x="5.5" y="7" width="13" height="12.5" rx="2"/><path d="M9.5 7V5a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v2M9 7v12.5M15 7v12.5M8 19.5V21M16 19.5V21"/>',
ticket: '<path d="M4.5 5.5h15a1 1 0 0 1 1 1v3a2.5 2.5 0 0 0 0 5v3a1 1 0 0 1-1 1h-15a1 1 0 0 1-1-1v-3a2.5 2.5 0 0 0 0-5v-3a1 1 0 0 1 1-1Z"/><path d="M14.5 5.5v2M14.5 11v2M14.5 16.5v2"/>',
bed: '<path d="M3.5 19.5v-14M3.5 15.5h17v4M20.5 15.5V12A2.5 2.5 0 0 0 18 9.5h-7.5v6"/><circle cx="7" cy="11.5" r="1.8"/>',
tent: '<path d="M2.5 19.5 12 4.5l9.5 15ZM9 19.5l3-5.5 3 5.5"/>',
passport: '<rect x="5.5" y="3.5" width="13" height="17" rx="2"/><circle cx="12" cy="10.5" r="3"/><path d="M9.5 16.5h5"/>',
// Media controls
'rotate-cw': '<path d="M19.5 12a7.5 7.5 0 1 1-2.2-5.3M19.5 4.5V9H15"/>',
rewind: '<path d="M11.5 7v10L4.5 12Z"/><path d="M19.5 7v10l-7-5Z"/>',
'fast-forward': '<path d="M12.5 7v10l7-5Z"/><path d="M4.5 7v10l7-5Z"/>',
// Added for services, trust, press and AI sections
ban: '<circle cx="12" cy="12" r="8.5"/><path d="M6 6l12 12"/>',
bug: '<rect x="7.5" y="8" width="9" height="12" rx="4.5"/><path d="M9.5 8a2.5 2.5 0 0 1 5 0M12 12v8M7.5 13H4M20 13h-3.5M7.5 17.5 5 19M16.5 17.5 19 19M7.5 9.5 5 8M16.5 9.5 19 8"/>',
newspaper: '<path d="M5.5 4.5h11a1 1 0 0 1 1 1V18a1.5 1.5 0 0 0 3 0V9.5h-3M5.5 4.5a1 1 0 0 0-1 1V18a1.5 1.5 0 0 0 1.5 1.5H19"/><path d="M8 8.5h6M8 12h6M8 15.5h3.5"/>',
bot: '<rect x="4.5" y="8" width="15" height="11" rx="3"/><path d="M12 8V4.5M9.5 13v1M14.5 13v1M2.5 13v2M21.5 13v2"/><circle cx="12" cy="4" r=".6"/>',
pipette: '<path d="M15.4 5.1a2.3 2.3 0 0 1 3.3 3.3L17 10.1 13.9 7zM12.6 5.7l5.7 5.7M14.5 8.9l-7.8 7.8a1.6 1.6 0 0 0-.4.7l-.8 2.8 2.8-.8a1.6 1.6 0 0 0 .7-.4l7.8-7.8"/>',
cat: '<path d="M5.2 11 4.8 4.5 9 7.3c1.9-.6 4.1-.6 6 0l4.2-2.8-.4 6.5"/><path d="M5.2 11c-.2 5 2.9 8.5 6.8 8.5s7-3.5 6.8-8.5"/><path d="M9.5 12v.8M14.5 12v.8M11.2 15.2h1.6L12 16.2Z"/>',
dog: '<path d="M7.5 9c0-2.5 2-4.5 4.5-4.5s4.5 2 4.5 4.5v4.5c0 3.3-2 6-4.5 6s-4.5-2.7-4.5-6Z"/><path d="M7.6 8.2 5 6.9c-.8-.4-1.7.3-1.5 1.2l.9 4.4c.2.9 1.3 1.1 1.8.4l1.3-1.7M16.4 8.2 19 6.9c.8-.4 1.7.3 1.5 1.2l-.9 4.4c-.2.9-1.3 1.1-1.8.4l-1.3-1.7"/><path d="M10 11v.8M14 11v.8M11 15h2l-1 1.2Z"/>',
rabbit: '<path d="M10.2 9.4C8.8 7 8.4 4.6 9.2 3.7c1.1-1.2 2.6 1 2.8 5.3M13.8 9.4c1.4-2.4 1.8-4.8 1-5.7-1.1-1.2-2.6 1-2.8 5.3"/><circle cx="12" cy="14.5" r="5.5"/><path d="M10 14v.8M14 14v.8M11.2 17h1.6"/>',
bird: '<path d="M17.5 9.5a4 4 0 0 0-7.8-1.3L4 14.5c3.2 3 8.2 3.6 11.2 1.4 1.8-1.3 2.6-3.5 2.3-6.4l2.5-1.2-2.7-1.4"/><path d="M10.5 17.5v3M13.5 17v3.5M14.2 8.3v.6"/><path d="M8.5 13.5c1.5.3 3.2-.2 4.5-1.5"/>',
syringe: '<path d="m17.5 3 3.5 3.5M19.25 4.75l-3 3M14.5 5.5l4 4M16.5 7.5l-8.5 8.5H5v-3l8.5-8.5M10.5 9.5l1.5 1.5M8.5 11.5l1.5 1.5M5 19l-2 2"/>',
} as const;
export type IconName = keyof typeof ICONS;
export const ICON_NAMES = Object.keys(ICONS) as IconName[];
export interface IconProps extends Omit<React.SVGProps<SVGSVGElement>, 'name'> {
name: IconName;
size?: number;
/** Label for screen readers. Without it the icon is decorative and hidden. */
label?: string;
}
export function Icon({ name, size = 20, label, className, strokeWidth = 1.6, ...rest }: IconProps) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={size}
height={size}
fill="none"
stroke="currentColor"
strokeWidth={strokeWidth}
strokeLinecap="round"
strokeLinejoin="round"
role={label ? 'img' : undefined}
aria-label={label}
aria-hidden={label ? undefined : true}
className={cn('shrink-0', className)}
dangerouslySetInnerHTML={{ __html: ICONS[name] }}
{...rest}
/>
);
}Häufige Fragen
Wie installiere ich Icons?
Mit aiw add @ai-website/icon. Der Befehl legt die Datei components/ui/icon.tsx in dein Projekt, der Code gehört danach dir. Weitere npm-Pakete braucht sie nicht.
Welche Varianten hat Icons?
3 Varianten, Alle Icons, Größen und Strich und Behälter.
Kann ein KI-Assistent Icons einbauen?
Ja. Über den MCP-Server der aiw CLI finden Claude, Cursor, GitHub Copilot, Windsurf, Codex und Gemini Icons mit aiw_components und installieren sie mit aiw_add @ai-website/icon.