diff --git a/src/_rules/background.js b/src/_rules/background.js
index b9ac325..4f36b1b 100644
--- a/src/_rules/background.js
+++ b/src/_rules/background.js
@@ -36,4 +36,7 @@ export const backgrounds = [
   ['bg-origin-padding', { 'background-origin': 'padding-box' }],
   ['bg-origin-content', { 'background-origin': 'content-box' }],
   ...makeGlobalStaticRules('bg-origin', 'background-origin'),
+
+  //arbitrary
+  [/^bg-\[url\('(.+)'\)]/, ([, p]) => ({ 'background-image': `url(${p})` })],
 ];
diff --git a/test/background.js b/test/background.js
index 4f2313f..03860bd 100644
--- a/test/background.js
+++ b/test/background.js
@@ -51,3 +51,12 @@ test('bg invalid', async ({ uno }) => {
   const { css } = await uno.generate(classes);
   expect(css).toMatchInlineSnapshot('""');
 });
+
+test('bg arbitrary url', async ({ uno }) => {
+  const classes = [`bg-[url('/img/hero-pattern.svg')]`];
+  const { css } = await uno.generate(classes);
+  expect(css).toMatchInlineSnapshot(`
+    "/* layer: default */
+    .bg-\\\\[url\\\\(\\\\'\\\\/img\\\\/hero-pattern\\\\.svg\\\\'\\\\)\\\\]{background-image:url(/img/hero-pattern.svg);}"
+  `);
+});