Shiori ChatCraft

Preset

Pick a look — the preview updates instantly

Chat Style

Layout

Direction

Alignment

Reverse directionOFF

Name below messageOFF

Colors

Font & text size

Sets the overall font / size — colors & per-element tweaks live on the canvas element

Font

Name size

Name weight

Message size

Message weight

Chat column width

Fill rowOFF

Fill row = the bubble stretches to the column width instead of hugging its text

Width

Full widthOFF

Width = column width in px, used by both styles. Full width (below) stretches to the OBS source width instead (ignores px).

Decoration

A decoration image on every bubble — adjust here, or click it on the canvas to drag / resize like the avatar

Show in OBS

On = type appears in exported OBS CSS; Off = stripped from output

Normal chatON

Paid chat

MembershipON

Gifted membershipsON

Super ChatON

Super StickerON

Super GiftsON

Speed:

0 / 0 · loop 1

Zoom: 100%

Background:

Guides:

Preview: the exact CSS that exports, rendered on real YouTube DOM — this is what OBS shows. Switch to Edit to design.