# Tailwind supports arbitrary values with square brackets

**Date:** 2025-11-26  
**Tags:** Tailwind, CSS, Frontend  
**URL:** https://kelexine.is-a.dev/til/tailwind-arbitrary-values

---

TIL: Tailwind supports arbitrary values with square brackets. Need exactly 347px? Use w-[347px]. Works with any property. Saved me from creating custom classes for one-off designs. Keep it in Tailwind's DSL.


```html
<div class="w-[347px] h-[23.5rem] top-[117px]">
  <!-- Arbitrary values inline! -->
</div>

<!-- Even with colors -->
<div class="bg-[#1da1f2] text-[rgba(255,0,0,0.5)]">
  Brand colors without config
</div>
```



**Related:** [https://tailwindcss.com/docs/adding-custom-styles#using-arbitrary-values](https://tailwindcss.com/docs/adding-custom-styles#using-arbitrary-values)


---

*This content is available at [kelexine.is-a.dev/til/tailwind-arbitrary-values](https://kelexine.is-a.dev/til/tailwind-arbitrary-values)*