<div>
  <p>
    Font size, font family, the padding and width for this paragraph were set using CSS variables, which you can safely start to use in your projects with PostCSS-cssnext. 
  </p>
</div>
@use cssnext;
:root {
  --fontSize: 2em;
  --font-family: sans-serif;
  --paragraph-length: 80%;
  --padding: 1em;
}

p {
  font-size: var(--fontSize);
  font-family: var(--font-family);
  max-width: var(--paragraph-length);
  padding-left: var(--padding);
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.