How to convert background-position: % in Tailwind

If you're using the new just-in-time (JIT) mode, you can generate this class on the fly.

Then you can just use: bg-[0% 20%]. The square brackets just mean that this is an arbitrary value that isn't in the config.

Here are the docs for JIT mode.

https://tailwindcss.com/docs/just-in-time-mode

JIT for tailwind v3 is currently not implemented.

I was able to achieve

background-position: -200% 0%;

or

background-position-x: -200%;
background-position-y: 0%

by doing

bg-[left_calc(-200%)_top_calc(0%)]

looks like background position, background image and background size cannot accept arbitrary values, I did try on the Tailwind Play without any luck: https://play.tailwindcss.com/MkuaNCxvFs?layout=horizontal