Smart styling when you drop a widget

When you drag or click a widget out of Lesson Widgets onto a scene, Berdee does a small bit of work to make the new widget feel like it belongs. Instead of always landing in raw factory defaults, the widget inherits styling from what's already on the scene.

How it works

When you drop a widget, Berdee looks at the scene in this order:

1. Same-type peer wins. If the scene already has a widget of the same kind — for example, you already have one button and you drop another — the new widget copies the existing widget's colors, font, and corner radius. The most recently added widget of that kind is the donor.
2. Mix-and-match from other widgets. If there's no same-type peer, Berdee pulls each style key from the most recently added widget on the scene that has it. Drop a button onto a scene with one styled text widget, and the button's fontFamily becomes the text widget's font. Colors that don't make sense to copy (like an empty backgroundColor from a Text widget) are skipped. A text widget never passes on its font size: a 52px heading is the right size for a heading, not for the answers of a Multiple Choice you add under it, so the new widget keeps its own size and "Mercury" fits its answer tile. Other widgets do pass their size on, so a Multiple Choice dropped beside an 18px Text Input starts at 18px too. Bold and line spacing are never copied between different kinds of widget. A same-type peer from step 1 still passes everything on, so a second Multiple Choice matches the first one you resized.
3. Your lesson's theme fills the gaps. If a style key is still at its factory default after the donor checks — common on a fresh scene with nothing on it yet — the lesson's theme or palette supplies it: role colors, font, and corner radius all come from the palette you picked. Widgets already on the scene always beat the theme, so a scene you've styled by hand keeps its own look.
4. Fall back to scene background. If no widget or theme can donate a text color and your scene has a background color, Berdee picks a readable text color — white on dark backgrounds, dark on light ones. If your scene uses a background image instead, the dominant color of the image is sampled in the background and the text color is updated once the image loads.

Text effects stay with their text

A new text widget never copies another text's text effects. It still takes that text's font and color, but it starts with no visual effect and no entrance effect. An effect is emphasis for one piece of text, and Typing and Morph between show their own strings instead of the widget's words, so a copied effect would replace what you type. Add an effect to the new text yourself if you want one.

Image backgrounds stay transparent

A new image widget always keeps its transparent background. It never copies another image's background color, and the theme never fills it — so placed images (especially transparent PNGs) sit directly on the scene instead of inside a colored box. You can still set a background color by hand in the properties panel; that choice sticks to that one image and won't carry over to the next.

What's not affected

Smart styling only fires when you add a widget from Lesson Widgets to a scene. Copy/paste, duplicate, copy-to-scene, and moving a widget into a container all preserve the original styling exactly — nothing is recomputed in those flows.

Layouts

Widgets that live on the scene's applied layout (the shared backdrop behind the active scene) are part of the donor pool, but with lower priority — any same-type peer on the active scene always wins over a layout donor. This matches what you see on screen: layout widgets are the visual backdrop, but the active scene is what authors are editing.

Override at any time

Smart styling is a starting point. Open the properties panel and adjust any value — your edits are never overwritten by another widget's drop, and the async background-image color sampler only writes a text color when the value is still the factory default.