The CSS universal selector is denoted by an asterisk *. It matches any and all elements in the document tree. It is a powerful tool primarily used for global resets and normalizing box models.

Syntax and Usage

Simply use the asterisk as the selector:

* {
  margin: 0;
  padding: 0;
}

Common Use Cases

• CSS Resets: Removing default browser margins and padding to start with a clean slate.
• Box Sizing: Setting box-sizing: border-box globally to make layout math intuitive.
• Testing: Quickly visualizing layout structures (e.g., * { outline: 1px solid red }).

Performance & Specificity

The universal selector has a specificity of 0-0-0. This means it is easily overridden by any class, ID, or element selector. While modern browsers handle it well, avoid using it for complex properties (like gradients or shadows) on large pages, as it forces the browser to re-calculate styles for every single node.