Ask any question about Tailwind CSS here... and get an instant response.
How do I customize spacing in Tailwind config?
Asked on Nov 07, 2025
Answer
To customize spacing in Tailwind CSS, you can modify the `tailwind.config.js` file to extend or override the default spacing scale. This allows you to define custom values for margins, padding, and other spacing utilities.
<!-- BEGIN COPY / PASTE -->
module.exports = {
theme: {
extend: {
spacing: {
'72': '18rem',
'84': '21rem',
'96': '24rem',
}
}
}
}
<!-- END COPY / PASTE -->Additional Comment:
- To apply the custom spacing, use classes like "mt-72" or "p-96" in your HTML.
- The values you define can be any valid CSS length unit, such as rem, px, or %.
- Extending the spacing scale does not remove existing values; it only adds new ones.
- For a complete override, use the "spacing" key directly without "extend".
Recommended Links:
