# Live chat

Live chat: a free component, built on your design tokens, to use on a live stream, live class or event broadcast page. A live stream with its chat: the stream frame with a LIVE tag and viewer count, the title, host and Follow, then a chat panel with a pinned message, messages with host, moderator and member badges, and a composer.

Prompt: Add the OpenDesigner component live-chat to this project: https://opendesigner.dev/library/r/live-chat.html. Keep its markup and states; map its --ds-* variables to my tokens.

States: live, pinned, new message, following, hover, focus.

Accessibility: The messages are a log region that announces new ones politely and scrolls inside itself; the composer is a labelled form that sends with Enter, Follow is a toggle with aria-pressed, and the LIVE dot stops pulsing with reduced motion.

File: https://opendesigner.dev/library/r/live-chat.html