This article was originally published on Codrops CSS Reference.

The unset CSS keyword can act as either initial or inherit depending on what the property's default behaviour is. If the property is an inherited property, it will be treated as inherit, taking the computed value of its parent element. If not, it will be treated as initial, and the property's initial value becomes its specified value.

As both the initial and inherit keywords can be used on any CSS property, the unset keyword can be applied to any CSS property, including the CSS shorthand all.

This keyword acts as a reset, by erasing all declared values on the element applied earlier up the cascade, restoring them to their original behaviour and inheritance, as if no styles were applied. This applies to user-agent styles as well. For example, applying all: unset to the body element will remove the default 8px margin set by almost all user-agent stylesheets.


Some commonly used CSS properties that are inherited properties include font-family and color. The background-color property, on the other hand, is not inherited. Say we have the following HTML, with some simple styles applied to the elements.

  <div>Hello, world!</div>
  <div class="unset">Hello, monkey!</div>
  <div>Hello, watermelon!</div>
body {
  background-color: #F5F5F5;
  color: #555;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

div {
  background-color: #C0C0C0;
  color: #006400;
  font-family: Georgia, Times, Times New Roman, serif;

If we add the property all: unset to the element with the class "unset", then check its computed CSS property values (from the browser's Developer Tools), we will see that the inherited properties of color and font-family inherit from the body element, while the background-color gets set back to the initial value of transparent.

Live Demo

Browser Support

[caniuse feature="css-unset-value"]


The unset value is supported in Microsoft Edge.