Spacing
One scale drives every gap in the system — padding, margin, gap and inset all resolve to the tokens below, which is what keeps rhythm consistent between a button’s internals and a page’s sections. In markup you rarely name these directly; the spacing utilities apply them for you.
Primitive
Section titled “Primitive”--tng-spacing-00px
--tng-spacing-022px
--tng-spacing-044px
--tng-spacing-066px
--tng-spacing-088px
--tng-spacing-1010px
--tng-spacing-1212px
--tng-spacing-1616px
--tng-spacing-2020px
--tng-spacing-2424px
--tng-spacing-3232px
--tng-spacing-4040px
--tng-spacing-4444px
--tng-spacing-4848px
--tng-spacing-5656px
--tng-spacing-6464px
--tng-spacing-7272px
--tng-spacing-8080px
--tng-spacing-8888px
--tng-spacing-9696px
--tng-spacing-104104px
--tng-spacing-120120px
--tng-spacing-140140px
--tng-spacing-160160px
--tng-spacing-240240px
--tng-spacing-00px
--tng-spacing-022px
--tng-spacing-044px
--tng-spacing-066px
--tng-spacing-088px
--tng-spacing-1010px
--tng-spacing-1212px
--tng-spacing-1616px
--tng-spacing-2020px
--tng-spacing-2424px
--tng-spacing-3232px
--tng-spacing-4040px
--tng-spacing-4444px
--tng-spacing-4848px
--tng-spacing-5656px
--tng-spacing-6464px
--tng-spacing-7272px
--tng-spacing-8080px
--tng-spacing-8888px
--tng-spacing-9696px
--tng-spacing-104104px
--tng-spacing-120120px
--tng-spacing-140140px
--tng-spacing-160160px
--tng-spacing-240240px
--tng-spacing-00px
--tng-spacing-022px
--tng-spacing-044px
--tng-spacing-066px
--tng-spacing-088px
--tng-spacing-1010px
--tng-spacing-1212px
--tng-spacing-1616px
--tng-spacing-2020px
--tng-spacing-2424px
--tng-spacing-3232px
--tng-spacing-4040px
--tng-spacing-4444px
--tng-spacing-4848px
--tng-spacing-5656px
--tng-spacing-6464px
--tng-spacing-7272px
--tng-spacing-8080px
--tng-spacing-8888px
--tng-spacing-9696px
--tng-spacing-104104px
--tng-spacing-120120px
--tng-spacing-140140px
--tng-spacing-160160px
--tng-spacing-240240px
Semantic
Section titled “Semantic”--tng-spacing-none0px
--tng-spacing-3xs2px
--tng-spacing-2xs4px
--tng-spacing-xs6px
--tng-spacing-sm8px
--tng-spacing-md10px
--tng-spacing-lg12px
--tng-spacing-xl16px
--tng-spacing-2xl20px
--tng-spacing-3xl24px
--tng-spacing-4xl32px
--tng-spacing-5xl40px
--tng-spacing-6xl44px
--tng-spacing-7xl48px
--tng-spacing-8xl56px
--tng-spacing-9xl64px
--tng-spacing-10xl72px
--tng-spacing-11xl80px
--tng-spacing-12xl88px
--tng-spacing-13xl96px
--tng-spacing-14xl104px
--tng-spacing-15xl120px
--tng-spacing-16xl140px
--tng-spacing-17xl160px
--tng-spacing-18xl240px
--tng-spacing-none0px
--tng-spacing-3xs2px
--tng-spacing-2xs4px
--tng-spacing-xs6px
--tng-spacing-sm8px
--tng-spacing-md10px
--tng-spacing-lg12px
--tng-spacing-xl16px
--tng-spacing-2xl20px
--tng-spacing-3xl24px
--tng-spacing-4xl32px
--tng-spacing-5xl40px
--tng-spacing-6xl44px
--tng-spacing-7xl48px
--tng-spacing-8xl56px
--tng-spacing-9xl64px
--tng-spacing-10xl72px
--tng-spacing-11xl80px
--tng-spacing-12xl88px
--tng-spacing-13xl96px
--tng-spacing-14xl104px
--tng-spacing-15xl120px
--tng-spacing-16xl140px
--tng-spacing-17xl160px
--tng-spacing-18xl240px
--tng-spacing-none0px
--tng-spacing-3xs2px
--tng-spacing-2xs4px
--tng-spacing-xs6px
--tng-spacing-sm8px
--tng-spacing-md10px
--tng-spacing-lg12px
--tng-spacing-xl16px
--tng-spacing-2xl20px
--tng-spacing-3xl24px
--tng-spacing-4xl32px
--tng-spacing-5xl40px
--tng-spacing-6xl44px
--tng-spacing-7xl48px
--tng-spacing-8xl56px
--tng-spacing-9xl64px
--tng-spacing-10xl72px
--tng-spacing-11xl80px
--tng-spacing-12xl88px
--tng-spacing-13xl96px
--tng-spacing-14xl104px
--tng-spacing-15xl120px
--tng-spacing-16xl140px
--tng-spacing-17xl160px
--tng-spacing-18xl240px