CSS Overrides

Use this feature to modify and preview CSS on all devices in real-time. Access it from the CSS Overrides tab in the debugging panel.

Document image

Any modifications you make will appear instantly on every device.

Document image

To test changes on individual devices instead, use the device picker dropdown.

Document image

Additionally, you can clear any or all CSS overrides; or use the code prettifier to automatically format your code.

Document image

Picking individual elements to override

If you use tools that generate random class names, for example, CSS-in-JS, use the universal selector to find individual element selectors on a page. To do this, click on the Pick Element to Override button to the left of the device picker.

Document image

Picking any element on the page displays the selector for that element, which you can modify on all devices, or individually using the device picker.

Document image