Class references
Updated on August 22, 2024
In this article, you'll find a class reference table for each of the properties customized by Baleada Tailwind Linear, matching up their linear numeric class names with the original Tailwind names.
Colors
Blue is shown here as an example, but Baleada Linear Numeric includes all of the default Tailwind colors.
Baleada Linear Numeric also includes Tailwind's default standalone colors black, white, and transparent.
Class
Tailwind equivalent
Value
.bg-blue-0.5.bg-blue-50#eff6ff.bg-blue-1.bg-blue-100#dbeafe.bg-blue-2.bg-blue-200#bfdbfe.bg-blue-3.bg-blue-300#93c5fd.bg-blue-4.bg-blue-400#60a5fa.bg-blue-5.bg-blue-500#3b82f6.bg-blue-6.bg-blue-600#2563eb.bg-blue-7.bg-blue-700#1d4ed8.bg-blue-8.bg-blue-800#1e40af.bg-blue-9.bg-blue-900#1e3a8a.bg-blue-9.5.bg-blue-950#172554Spacing
height is shown here as an example, but spacing affects several other Tailwind core plugins. Visit the Tailwind docs for a full list.
Class
Tailwind equivalent
Value
.h-0.h-00px.h-1.h-10.25rem.h-2.h-20.5rem.h-3.h-30.75rem.h-4.h-41rem.h-5.h-51.25rem.h-6.h-61.5rem.h-7.h-71.75rem.h-8.h-82rem.h-9.h-92.25rem.h-10.h-102.5rem.h-11.h-112.75rem.h-12.h-123rem.h-13.h-143.5rem.h-14.h-164rem.h-15.h-205rem.h-16.h-246rem.h-17.h-287rem.h-18.h-328rem.h-19.h-369rem.h-20.h-4010rem.h-21.h-4411rem.h-22.h-4812rem.h-23.h-5213rem.h-24.h-5614rem.h-25.h-6015rem.h-26.h-6416rem.h-27.h-7218rem.h-28.h-8020rem.h-29.h-9624rem.h-px-1.h-px1px.h-0.5.h-0.50.125rem.h-1.5.h-1.50.375rem.h-2.5.h-2.50.625rem.h-3.5.h-3.50.875remBlur
Class
Tailwind equivalent
Value
.blur-0.blur-00.blur-3.blur-sm4px.blur-4.blur8px.blur-5.blur-md12px.blur-6.blur-lg16px.blur-7.blur-xl24px.blur-8.blur-2xl40px.blur-9.blur-3xl64pxBorder radius
Class
Tailwind equivalent
Value
.rounded-0.rounded-none0px.rounded-3.rounded-sm0.125rem.rounded-4.rounded0.25rem.rounded-5.rounded-md0.375rem.rounded-6.rounded-lg0.5rem.rounded-7.rounded-xl0.75rem.rounded-8.rounded-2xl1rem.rounded-9.rounded-3xl1.5rem.rounded-full.rounded-full9999pxBorder width
Class
Tailwind equivalent
Value
.border-0.border-00px.border-4.border1px.border-5.border-22px.border-6.border-44px.border-7.border-88pxBox shadow
Class
Tailwind equivalent
Value
.shadow-0.shadow-nonenone.shadow-3.shadow-sm0 1px 2px 0 rgb(0 0 0 / 0.05).shadow-4.shadow0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1).shadow-5.shadow-md0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1).shadow-6.shadow-lg0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1).shadow-7.shadow-xl0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1).shadow-8.shadow-2xl0 25px 50px -12px rgb(0 0 0 / 0.25).-shadow-4.shadow-innerinset 0 2px 4px 0 rgb(0 0 0 / 0.05)Drop shadow
Class
Tailwind equivalent
Value
.drop-shadow-0.drop-shadow-none0 0 #0000.drop-shadow-3.drop-shadow-sm0 1px 1px rgb(0 0 0 / 0.05).drop-shadow-4.drop-shadow0 1px 2px rgb(0 0 0 / 0.1),0 1px 1px rgb(0 0 0 / 0.06).drop-shadow-5.drop-shadow-md0 4px 3px rgb(0 0 0 / 0.07),0 2px 2px rgb(0 0 0 / 0.06).drop-shadow-6.drop-shadow-lg0 10px 8px rgb(0 0 0 / 0.04),0 4px 3px rgb(0 0 0 / 0.1).drop-shadow-7.drop-shadow-xl0 20px 13px rgb(0 0 0 / 0.03),0 8px 5px rgb(0 0 0 / 0.08).drop-shadow-8.drop-shadow-2xl0 25px 25px rgb(0 0 0 / 0.15)Flex grow
Class
Tailwind equivalent
Value
.flex-grow-0.flex-grow-00.flex-grow-4.flex-grow1Flex shrink
Class
Tailwind equivalent
Value
.flex-shrink-0.flex-shrink-00.flex-shrink-4.flex-shrink1Font size
Class
Tailwind equivalent
Value
.text-2.text-xs0.75rem,[object Object].text-3.text-sm0.875rem,[object Object].text-4.text-base1rem,[object Object].text-5.text-lg1.125rem,[object Object].text-6.text-xl1.25rem,[object Object].text-7.text-2xl1.5rem,[object Object].text-8.text-3xl1.875rem,[object Object].text-9.text-4xl2.25rem,[object Object].text-10.text-5xl3rem,[object Object].text-11.text-6xl3.75rem,[object Object].text-12.text-7xl4.5rem,[object Object].text-13.text-8xl6rem,[object Object].text-14.text-9xl8rem,[object Object]Font weight
Class
Tailwind equivalent
Value
.font-1.font-thin100.font-2.font-extralight200.font-3.font-light300.font-4.font-normal400.font-5.font-medium500.font-6.font-semibold600.font-7.font-bold700.font-8.font-extrabold800.font-9.font-black900Letter spacing
Class
Tailwind equivalent
Value
.tracking-0.tracking-normal0em.tracking-1.tracking-wide0.025em.tracking-2.tracking-wider0.05em.tracking-3.tracking-widest0.1em.-tracking-2.tracking-tighter-0.05em.-tracking-1.tracking-tight-0.025emLine height
Class
Tailwind equivalent
Value
.leading-0.leading-none1.leading-2.leading-tight1.25.leading-3.leading-snug1.375.leading-4.leading-normal1.5.leading-5.leading-relaxed1.625.leading-6.leading-loose2.leading-rem-3.leading-3.75rem.leading-rem-4.leading-41rem.leading-rem-5.leading-51.25rem.leading-rem-6.leading-61.5rem.leading-rem-7.leading-71.75rem.leading-rem-8.leading-82rem.leading-rem-9.leading-92.25rem.leading-rem-10.leading-102.5remMax width
Class
Tailwind equivalent
Value
.max-w-0.max-w-nonenone.max-w-1.max-w-xs20rem.max-w-2.max-w-sm24rem.max-w-3.max-w-md28rem.max-w-4.max-w-lg32rem.max-w-5.max-w-xl36rem.max-w-6.max-w-2xl42rem.max-w-7.max-w-3xl48rem.max-w-8.max-w-4xl56rem.max-w-9.max-w-5xl64rem.max-w-10.max-w-6xl72rem.max-w-11.max-w-7xl80rem.max-w-full.max-w-full100%.max-w-min.max-w-minmin-content.max-w-max.max-w-maxmax-content.max-w-prose.max-w-prose65ch.max-w-screen-sm.max-w-screen-sm640px.max-w-screen-md.max-w-screen-md768px.max-w-screen-lg.max-w-screen-lg1024px.max-w-screen-xl.max-w-screen-xl1280px.max-w-screen-2xl.max-w-screen-2xl1536pxOutline offset
Class
Tailwind equivalent
Value
.ring-offset-0.ring-offset-00px.ring-offset-1.ring-offset-11px.ring-offset-2.ring-offset-22px.ring-offset-3.ring-offset-44px.ring-offset-4.ring-offset-88pxOutline width
Class
Tailwind equivalent
Value
.ring-0.ring-00px.ring-1.ring-11px.ring-2.ring-22px.ring-3.ring-44px.ring-4.ring-88pxRing offset width
Class
Tailwind equivalent
Value
.ring-offset-0.ring-offset-00px.ring-offset-1.ring-offset-11px.ring-offset-2.ring-offset-22px.ring-offset-3.ring-offset-44px.ring-offset-4.ring-offset-88pxRing width
Class
Tailwind equivalent
Value
.ring-0.ring-00px.ring-2.ring-11px.ring-3.ring-22px.ring-4.ring3px.ring-5.ring-44px.ring-6.ring-88pxText decoration thickness
Class
Tailwind equivalent
Value
.decoration-0.decoration-00px.decoration-1.decoration-11px.decoration-2.decoration-22px.decoration-3.decoration-44px.decoration-4.decoration-88px.decoration-auto.decoration-autoauto.decoration-from-font.decoration-from-fontfrom-fontText underline offset
Class
Tailwind equivalent
Value
.underline-0.underline-00px.underline-1.underline-11px.underline-2.underline-22px.underline-3.underline-44px.underline-4.underline-88px.underline-auto.underline-autoautoTransition duration
Class
Tailwind equivalent
Value
.duration-1.duration-7575ms.duration-2.duration-100100ms.duration-3.duration-150150ms.duration-4.duration-200200ms.duration-5.duration-300300ms.duration-6.duration-500500ms.duration-7.duration-700700ms.duration-8.duration-10001000msTransition delay
Class
Tailwind equivalent
Value
.delay-1.delay-7575ms.delay-2.delay-100100ms.delay-3.delay-150150ms.delay-4.delay-200200ms.delay-5.delay-300300ms.delay-6.delay-500500ms.delay-7.delay-700700ms.delay-8.delay-10001000ms