CCM Tablet → Mobile Fluid Clamp

Type your Tablet rem value per tag — that's the starting point (no Desktop derivation here). It immediately computes the clamp() toward Mobile, using the 1099px → 320px range. Still 1rem = 10px convention, since the root font-size stays flat across this whole range.

1rem = 10px (fixed, unlike the 1920→1100 zoom range)
⚠️ The default ratio (75%) and floors here are estimates only, adapted from the earlier Desktop-based ratio (82%/62%) — not sourced from the Wix reference. Adjust based on your actual tablet/mobile design.
75%
TagTablet input (rem)
= size @1099px
Floor (px)Mobile target
= size @320px (auto-computed)
clamp() — rem
⚠️ The default ratio (89%) here is also an estimate, adapted from the earlier Body/UI ratio (94%/84%). Default floor = 16px (Google's mobile-friendly minimum) — avoid lowering this too much, and there's a hard 12px floor that can't be bypassed.
89%
TagTablet input (rem)
= size @1099px
Floor (px)Mobile target
= size @320px (auto-computed)
clamp() — rem

👇 Live Preview — this is where you'll see the ACTUAL fluid shrink

The two tables above are FIXED reference values only (Tablet target and Mobile target) — they don't move. The actual interactive fluid interpolation is shown HERE — drag the slider to see each tag shrink smoothly from its Tablet target to its Mobile target.

320px 1099px 1099px

Generated CSS — @media (max-width: 1099px)