Element Properties

Every element has width and height controls that accept values in three units: px, %, and rem. Pixel values give you absolute sizing, percentages make elements responsive to their parent container, and rem values scale relative to the base font size.

You can also set max-width and max-height constraints to prevent elements from growing beyond a specific size. Leave width or height set to "auto" to let the element size itself based on its content.

Padding and margin controls use a four-sided input for top, right, bottom, and left values. Click the link icon to lock all four sides together -- changing one value updates them all. Click it again to unlink the sides and set each independently.

Elements default to relative (flow) positioning, where they stack naturally inside their parent container. Switch to absolute positioning to place an element at exact x/y coordinates on the slide.

Absolutely positioned elements also expose a z-index control, letting you layer elements in front of or behind each other. This is useful for overlapping images, decorative backgrounds, or floating labels.

The effects section gives you control over opacity, border, border radius, box shadow, and CSS transforms. These let you add depth, separation, and polish to your designs.

Most numeric inputs in the properties panel support scrub-to-change: click and drag horizontally on the input label to increase or decrease the value smoothly. This gives you a tactile, Figma-like editing experience.

Scrub-to-change works on font size, padding, margin, gap, border radius, opacity, and any other numeric property. Hold Shift while scrubbing to change values in larger increments.