06 Elements

AI Elements

The pieces a chat surface is made of — which model, which file, which tool — built from the primitives and the icon sets.

Model Selector

The model a message goes to, and the menu that changes it: rows grouped by vendor, each wearing its vendor's mark, with a search box for the long lists.

Message

One turn in a thread: an avatar at its foot, the words in parts with six fills from primary to unframed ghost and reactions on the edge, and a footer with the time and a row of actions that shows on hover.

Message Variants

Six fills from a strong primary to unframed ghost, a tail on the last part, and reactions on the edge.

Message Scroller

The scrolling part of a thread: it follows a streaming reply down while you are at the bottom, lets go when you scroll up, and offers the way back.

Stream Text

A reply let out a whole word at a time on a steady clock, so bursts even out: each word fades in a shade light and settles, backticked code becomes a chip, and a caret holds the end until the last word is out.

Composer

A message bar: a one-line field that grows with what is written and sends on Enter, a send button at its end that turns to Stop while the reply is on its way, and round buttons beside it for tools.