A tailwind plugin for content-visibility & contain-intrinsic-size.

• content-visibility: the new CSS property that boosts your rendering performance

Use visibility-auto, visibility-hidden or visibility-visible in combination with intrinsic-size.

<div class="visibility-auto intrinsic-size-9">
  // ...
</div>

or use intrinsic-w & intrinsic-h for more specific placeholder sizing.

<div class="visibility-auto intrinsic-h-3 intrinsic-w-5">
  // ...
</div>

all classes have responsive variants, so they can be used in a variety of different combinations.

<div class="md:visibility-auto md:intrinsic-h-3 md:intrinsic-w-5 lg:intrinsic-size-12">
  // ...
</div>

the intrinsic-size & intrinsic-w variants inherit from your theme's width definitions.

The same goes for the intrinsic-h variants which inherit from the defined height in your theme.