IconBadge

IconBadge renders a small icon surface for nav rows, cards, and status blocks.

github.com/fastygo/templ/components

Summary

IconBadge renders a small icon surface for nav rows, cards, and status blocks.

Use Cases

Render navigation icons with a consistent surface

Render workflow and feature card pictograms

Semantics

IconBadge uses ui.Icon when BaseClass or svg type is provided

IconBadge falls back to Text or the first rune of Name

Example variant.default

import cmp "github.com/fastygo/templ/components"

templ Example() {
	@cmp.IconBadge(cmp.IconBadgeProps{Name: "home"})
}

import cmp "github.com/fastygo/templ/components"

templ Example() {
	@cmp.IconBadge(cmp.IconBadgeProps{Name: "home"})
}

Example icon.pack

import cmp "github.com/fastygo/templ/components"

templ Example() {
	@cmp.IconBadge(cmp.IconBadgeProps{BaseClass: "icon", Prefix: "icon-", Name: "home"})
}

import cmp "github.com/fastygo/templ/components"

templ Example() {
	@cmp.IconBadge(cmp.IconBadgeProps{BaseClass: "icon", Prefix: "icon-", Name: "home"})
}

API

BaseClass · string — role: icon-pack-base-class

Name · string — role: icon-name

Prefix · string — role: icon-name-prefix

Size · string — role: density; enum: xs|sm|default|lg; default: default

Text · string — role: text-fallback