CalmUI
Styling

Keep Style Changes Responsive

Avoid moving nearby controls when a hover effect only needs a visual change.

For a hover effect, start with a color change or a small transform. Changing width or height can recalculate positions and move other controls.

Use only the shadows and gradient layers your design needs. To find an actual performance problem, record the View in Profiler and compare measurements before and after a change at the same resolution.

Check the Profiler's Reload cost numbers too: a style change that should only repaint, but instead triggers a full document reload on every update, costs far more than an extra shadow layer.