# Emoji

Tesserae integrates the Emoji.css stylesheet and provides an auto-generated strongly typed enum Emoji for easy access to all available emojis. This allows you to use emojis in your UI components with compile-time safety and IntelliSense support.

You can use the Emoji enum values typically with the Icon component or wherever an emoji icon is expected.

using Tesserae;
using static Tesserae.UI;

public class EmojiExample
{
    public void CreateEmoji()
    {
        // Render a large smile emoji
        var icon = Icon(Emoji.Smile, size: TextSize.Large);
    }
}

• Creates an icon component using the specified emoji.
• Parameters:
  • emoji: The Emoji 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.

This sample shows how to display various emojis using the Icon component.

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

public class EmojiSample : IComponent
{
    public HTMLElement Render()
    {
        return Stack().Children(
            Label("Smile:").Inline().SetContent(Icon(Emoji.Smile)),
            Label("Rocket:").Inline().SetContent(Icon(Emoji.Rocket)),
            Label("Heart:").Inline().SetContent(Icon(Emoji.Heart, color: "red"))
        ).Render();
    }
}

• UIcons - For using UIcons instead of Emojis.