Icon

Render crisp Lucide SVG icons with customizable scales, color variations, and optional boxed container badges.

Component Syntax

blade

<x-aura::icon name="sparkles" size="md" />

1. Scale Sizes

blade

xs

sm

md

lg

xl

<x-aura::icon name="star" size="xs" />

<x-aura::icon name="star" size="sm" />

<x-aura::icon name="star" size="md" />

<x-aura::icon name="star" size="lg" />

<x-aura::icon name="star" size="xl" />

2. Boxed Container Badges

blade

<x-aura::icon name="sparkles" variant="dark" size="md" shape="rounded" />

<x-aura::icon name="shield-check" variant="outline" size="md" shape="rounded" />

<x-aura::icon name="heart" variant="subtle" size="md" shape="circle" />

<x-aura::icon name="bell" variant="dark" size="md" shape="circle" />

Component Props

Available properties and configurations for the icon component.

Prop	Default	Available Values
name	circle	Icon name string (e.g. sparkles, star, check)
size	sm	xs sm md lg xl
variant	null	subtle secondary primary dark outline positive warning danger
shape	rounded	rounded circle square
container	false	true false

Aura Wire

Component Library

Icon

Component Syntax

1. Scale Sizes

2. Boxed Container Badges

Component Props

Badge

Animate

Aura Wire