Try an expressive bot in a local chat playground. Choose its shape, outfit and colors, then copy your configured React component.
Local demo · Scripted replies
Use a 3 or 6 digit hex color, rgb() or hsl(). Enter applies; Escape cancels; Default omits this prop.
Connection is simulated.
DefaultUsing component default
0–3× while dragging, in steps of 0.05. Drag across the field; its left and right edges select the minimum and maximum. Click the value to type. Arrow keys adjust; Shift uses larger steps. Enter applies a typed value; Escape cancels. Double-click the track or use Default to omit this prop.
Image
Reveal an image through an animated pixel mosaic. Compare transition presets, then copy the component and its configuration.
Get started
Install a component, copy a working configuration and connect it to your application's state and design system.