generated:catalog.entry.icons.title

• @xngui/iconsicons-doc:data.import-component-note
• @xngui/icons/allicons-doc:data.import-all-note
• @xngui/icons/lucideicons-doc:data.pack-lucide-note
• @xngui/icons/tablericons-doc:data.pack-tabler-note
• @xngui/icons/phosphoricons-doc:data.pack-phosphor-note
• @xngui/icons/material-symbolsicons-doc:data.pack-material-note
• @xngui/icons/fluenticons-doc:data.pack-fluent-note
• @xngui/icons/fontawesomeicons-doc:data.pack-fontawesome-note

• @xngui/icons/phosphor-regularicons-doc:data.import-phosphor-regular-note
• @xngui/icons/phosphor-boldicons-doc:data.import-phosphor-bold-note
• @xngui/icons/material-symbols-outlinedicons-doc:data.import-material-outlined-note
• @xngui/icons/material-symbols-roundedicons-doc:data.import-material-rounded-note
• @xngui/icons/fluent-filledicons-doc:data.import-fluent-filled-note

• Lucide lucide

  icons-doc:data.pack-lucide-note

  @xngui/icons/lucide
  styles.css

  @import '@xngui/icons/lucide';

  example.html

  <x-icon pack="lucide" name="heart" />

• Tabler tabler

  icons-doc:data.pack-tabler-note

  @xngui/icons/tabler
  styles.css

  @import '@xngui/icons/tabler';

  example.html

  <x-icon pack="tabler" name="heart" />

• Phosphor phosphor

  icons-doc:data.pack-phosphor-note

  @xngui/icons/phosphor
  styles.css

  @import '@xngui/icons/phosphor';

  example.html

  <x-icon pack="phosphor" name="heart" iconStyle="regular" />

• favorite

  Material Symbols material-symbols

  icons-doc:data.pack-material-note

  @xngui/icons/material-symbols
  styles.css

  @import '@xngui/icons/material-symbols';

  example.html

  <x-icon pack="material-symbols" name="heart" iconStyle="outlined" />

• Fluent fluent

  icons-doc:data.pack-fluent-note

  @xngui/icons/fluent
  styles.css

  @import '@xngui/icons/fluent';@import '@xngui/icons/fluent-filled';

  example.html

  <x-icon pack="fluent" name="heart" iconStyle="regular" />

• Font Awesome fontawesome

  icons-doc:data.pack-fontawesome-note

  @xngui/icons/fontawesome
  styles.css

  @import '@xngui/icons/fontawesome';

  example.html

  <x-icon pack="fontawesome" name="heart" iconStyle="solid" />

• solid heart

  icons-doc:data.style-solid-note

• regular heart

  icons-doc:data.style-regular-note

• brands github

  icons-doc:data.style-brands-note

• icons-doc:label.default

  icons-doc:label.spin
  [spin]="true"

  icons-doc:data.motion-spin-note

• icons-doc:label.default

  icons-doc:label.mirror
  [mirror]="true"

  icons-doc:data.motion-mirror-note

• --x-icon-size-xsicons-doc:data.size-standalone-xs
  xs
• --x-icon-size-smicons-doc:data.size-standalone-sm
  sm
• --x-icon-size-mdicons-doc:data.size-standalone-md
  md
• --x-icon-size-lgicons-doc:data.size-standalone-lg
  lg
• --x-icon-size-xlicons-doc:data.size-standalone-xl
  xl
• --x-control-icon-sizeicons-doc:data.size-control-inline
  Button

icons-doc:paragraph.glyph-catalog

• star
• heart
• gear
• user
• house
• magnifying-glass
• bell
• envelope
• check
• xmark
• plus
• trash
• pen
• copy
• download
• upload
• circle-info
• triangle-exclamation
• spinner
• bars
• chevron-right
• chevron-left
• arrow-right
• lock
• eye
• calendar
• clock
• bookmark
• share-nodes
• filter
• sort
• ellipsis
• circle-check
• circle-xmark
• bolt

• Favorite item

  icons-doc:paragraph.decorative

  <x-icon name="heart" />
• icons-doc:paragraph.meaningful

  <x-icon name="heart" ariaLabel="Favorite" />