Aura: Other Properties

Aura style properties related to sizing, spacing, corner shapes, shadows, and other visual styles.

--aura-base-size: Aura redefines the base style gap and padding properties, and those values are computed based on this property. The property value is a number without a unit (i.e., not a CSS length value). Suitable values range from 12 to 24. The resulting --vaadin-gap and --vaadin-padding values are defined with the px unit and are rounded to nearest 1px.
--aura-base-radius: Aura redefines the base style radius properties, and those values are computed based on this property. The property is a number without a unit (i.e., not a CSS length value). Suitable values range from 0 to 10, depending on the --aura-base-size value.

Setting the base radius to zero doesn’t make all corners square. If you wish to remove all rounded corners, override the base style radius properties directly.
--aura-shadow-xs: Sharp shadow for subtle elevation on Buttons, input fields, Checkboxes, Radio Buttons in their default state.
--aura-shadow-s: Shadow with slight elevation. Used for highlighting elements like primary Button, selected Checkbox and Radio Button. Also used for communicating visual hierarchy in elevated Card, Dashboard widget, Tabs and Tooltip.
--aura-shadow-m: Soft shadow for clearly elevated elements such as overlays of Menu Bar and Combo Box, Notification and modal Dialog.
--aura-shadow-color
--aura-overlay-shadow
--aura-overlay-outline-color
--aura-overlay-inner-outline-color
--aura-overlay-backdrop-filter