CodePen Embed - CSS Fluid Type Function

<div class="container">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat similique unde odio incidunt iusto recusandae fugit, ea ratione ipsum voluptatem deserunt beatae voluptatum dolorem corrupti soluta, mollitia praesentium eum perspiciatis?</div>

@function --fluid-type(--font-min, --font-max) {
	result: clamp(var(--font-min), 4vw + 1rem, var(--font-max));
}

.container {
  background: aliceblue;
  border-block-end: 2px solid lightblue;
  font-size: --fluid-type(20px, 40px);
  padding: 1.5rem;
}

This Pen is owned by Geoff Graham on CodePen.

See more by @geoffgraham on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.