Icon

A wrapper for Lucide Icons that is primarily styled with Tailwind utility classes. Browse the Lucide library to see what you can use.

Source Tailwind CSS

Installation

templui add icon

Examples

Colored

Filled

Sizes

package showcase

import "github.com/templui/templui/components/icon"

templ IconSizes() {
	<div class="flex flex-wrap gap-2">
		@icon.House(icon.Props{Class: "size-4"})
		@icon.House(icon.Props{Class: "size-8"})
		@icon.House(icon.Props{Class: "size-12"})
	</div>
}

API Reference

Required parameter

Hover for description

Icon

Wrapper component for Lucide Icons. Style icons with `icon.Props{Class: "..."}`.

Name	Type	Default
`Name` The name of the Lucide icon to display (e.g., 'heart', 'user', 'star').	`IconName`	-
`Class` Tailwind utility classes passed via `icon.Props{Class: "..."}`, for example `size-6 text-red-500 fill-current`.	`string`	`""`

Menu

Getting Started

Components

Icon

Installation

Examples

API Reference

Icon