# UIcons

# Description

Tesserae integrates the UIcons icon set and provides an auto-generated strongly typed enum UIcons for easy access. This allows you to use these icons in your UI components with compile-time safety.

# Usage

You can use the UIcons enum values typically with the Icon component.

using Tesserae;
using static Tesserae.UI;

public class UIconsExample
{
    public void CreateIcon()
    {
        // Render a camera icon
        var icon = Icon(UIcons.Camera, size: TextSize.Large);
    }
}

# Methods

# Icon(UIcons icon, string color = "", TextSize size = TextSize.Medium, TextWeight weight = TextWeight.Regular)

Creates an icon component using the specified UIcon.
Parameters:
- icon: The UIcons enum value to display.
- color: (Optional) CSS color for the icon.
- size: (Optional) Size of the icon (default: Medium).
- weight: (Optional) Font weight (default: Regular).
Returns: An Icon component.

# Samples

# Displaying UIcons

This sample shows how to display various UIcons.

using Tesserae;
using static Tesserae.UI;
using static H5.Core.dom;

public class UIconsSample : IComponent
{
    public HTMLElement Render()
    {
        return Stack().Children(
            Label("Camera:").Inline().SetContent(Icon(UIcons.Camera)),
            Label("Settings:").Inline().SetContent(Icon(UIcons.Settings)),
            Label("User:").Inline().SetContent(Icon(UIcons.User, color: "blue"))
        ).Render();
    }
}

# See also

Emoji - For using Emojis.