Angular

Fluent UI Emoji for Angular — a standalone fluentEmoji directive with tree-shakeable icon data. 3,145 emojis in flat, high-contrast, and modern styles. Angular 17+.

Install

pnpm add @fluentui-emoji/angular

Usage

import {Component} from '@angular/core';
import {FluentEmojiDirective, register} from '@fluentui-emoji/angular';
import {Rocket} from '@fluentui-emoji/angular/flat';

register(Rocket);

@Component({
  standalone: true,
  imports: [FluentEmojiDirective],
  template: `
    <span fluentEmoji="rocket"></span>
    <span fluentEmoji="rocket" emojiStyle="modern" emojiLabel="Rocket"></span>
  `,
})
export class AppComponent {}

Only registered icons end up in your bundle. Without emojiLabel the svg is aria-hidden. emojiHtml(name, style, label) is exported for direct use.