Tailwind CSS Fluid Scaling Plugin

Sizing

width

Utilities for controlling the width of an element.

Basic example

Use w-fluid-[breakpoints] utilities like w-fluid-[4,8] and w-fluid-[64px,96px] to set an element to a fixed width based on the spacing scale:

01

02

03

04

05

06

JSX

<div>
  <div class="w-fluid-[40px,80px] ...">01</div>
  <div class="w-fluid-[80px,120px] ...">02</div>
  <div class="w-fluid-[120px,160px] ...">03</div>
  <div class="w-fluid-[160px,200px] ...">04</div>
  <div class="w-fluid-[200px,240px] ...">05</div>
  <div class="w-fluid-[240px,280px] ...">06</div>
</div>

Follow us

© Gladeye 2026