Skip to content

Core component

Icon

Render accessible SVG symbols from a sprite. Give meaningful icons a label, mark visual-only icons as decorative, and use the examples below as a starting point for your .templ code.

The core rendering contract

Meaningful icons need a non-empty Label and are exposed as images to assistive technology. Set Decorative: true when an icon is visual-only. Sprite symbols inherit currentColor; size and root classes remain consumer-controlled.

SVG sprite
Meaningful icon
Announced as “Approved”
Decorative icon
Removed from the accessibility tree
Inherited color
Follows the parent color
Size scale

Copy-ready example

Render a meaningful icon

Pass the sprite URL and symbol, then provide a label when the icon conveys information. Add size and root classes only when the surrounding interface needs them.

Render an accessible icon
@icon.Icon(icon.Config{
	SpriteURL: heroicons.SpriteURL,
	Symbol:    heroicons.Icon16SolidCheckCircle,
	Label:     "Approved",
	RootClass: "text-success",
})

Go API

v0.3.3

The examples above cover behavior and composition. pkg.go.dev is the canonical reference for exported types, functions, methods, and Go documentation.

github.com/araihu/goshtoso/components/icon
Open v0.3.3 API