Styling an Overlay
- i changed the colours and now i cannot get the old look back
- does the design save by itself
- i tried a ready-made look and lost my settings
- how do i keep my own colours in the picker
- where is the transparency for a border
- it asks me about unsaved design every time i leave
- can i undo what i did in the design editor
- my colours are gone from the picker
What this page is
Every overlay is styled in the same editor: sections on the left, a live preview in the middle, the settings of the chosen section on the right. Alerts, chat, goals, lists, the auction board, the wheel, the bracket, the carousel and the challenge board all share it, so what you learn on one screen works on the rest.
The look belongs to one overlay. Two chat overlays in the same list are styled apart, and copying an overlay copies its look with it.
Nothing is saved until you press Save
Changes live on screen only. Move the sliders, try a ready-made look, pick colours — and if you do not like the result, leave: Save in the page header is what writes it down.
Leaving with unsaved changes asks first. That question appears both when you press Back to list inside a widget card and when you switch to another section in the left menu.
Ready-made looks work the same way: Apply puts the look on screen but writes nothing. Nothing is lost until you save, and nothing is kept until you do.
Ready-made looks
Neon, Minimal and Retro exist in every overlay and use the same colours, fonts and borders. Apply one to all your overlays and they will look like one set, not like nine separate widgets.
Applying a look also clears what it does not set, so the result does not depend on what you were turning before.
Below them is the list of your own templates: the name field with Save keeps the look that is on screen right now, and Delete removes a template. A template saved from one overlay can be applied to another — the editor translates what it can.
Colours
The colour picker holds two rows.
My colours stay until you remove them. The + at the end of the row keeps the colour you have picked right now; the cross in the corner of a colour removes it. Put the colours of your channel here once and they will be at hand in every overlay.
Recent are the last twelve colours you used anywhere in the app — the row flows on its own, a new colour pushing the oldest one out. That is why colours you care about belong in the row above.
Both rows are shared across the whole app: a shade picked in the chat overlay is one click away in alerts.
Every colour has a transparency slider next to it — text, backgrounds, borders and the colours of effects. The eyedropper next to the code field picks a colour from anywhere on the screen.
What it cannot do
- There is no undo inside the editor. What protects you is that nothing is written until Save — leaving without saving is the way back.
- A ready-made look cannot be applied to every overlay at once; it is applied per overlay.
- Templates are not folders: they are a flat list shared by all overlays.
- The preview shows the overlay, not your scene. Its width matches the box on the page, not the browser source in OBS.
- The eyedropper is not available in every window: where the browser does not offer it, the button is not shown.