SusIcon

Glyph from the kit icon set — size, color, optional spin.

Package

SusKit · Atoms (commercial)

Open in Playground

SusKit · Atoms

Props

Name	Type	Default
Icon	Prop<string>	""
Key	Prop<string>	""
Source	Prop<string>	""
Kind	Prop<string>	"auto"
Size	Prop<string>	"md"
SizePx	Prop<int>	0
Color	Prop<string>	""
Spin	Prop<bool>	false
Weight	Prop<SusIconWeight>	SusIconWeight.Regular

Slots

No slots.

Events

No public events.

Style hooks

USS class contract — override appearance without touching C#. States toggle via these classes:

• sus-icon
• sus-icon__image
• sus-icon--color-danger
• sus-icon--color-info
• sus-icon--color-inherit
• sus-icon--color-primary
• sus-icon--color-secondary
• sus-icon--color-success
• sus-icon--color-text
• sus-icon--color-warning
• sus-icon--fluid
• sus-icon--kind-game
• sus-icon--kind-portrait
• sus-icon--lg
• sus-icon--md
• sus-icon--missing
• sus-icon--sm
• sus-icon--spin
• sus-icon--xl
• sus-icon--xs

Usage

<template>
  <sus:SusIcon Icon="sword"
               Size="md"
               Color="primary" />
</template>

var icon = new SusIcon();
icon.Icon.Value = "gear";
icon.Size.Value = "lg";
icon.Spin.Value = true;

Size

xs · sm · md · lg · xl (or SizePx for an exact pixel size)

Notes

• Icon / Key name a Phosphor-style glyph; Source can point at a custom asset when Kind is not auto.