diff --git a/packages/preset-web-fonts/src/providers/bunny.ts b/packages/preset-web-fonts/src/providers/bunny.ts
index 4f7bcbe136..67c0f529ba 100644
--- a/packages/preset-web-fonts/src/providers/bunny.ts
+++ b/packages/preset-web-fonts/src/providers/bunny.ts
@@ -1,3 +1,33 @@
-import { createGoogleCompatibleProvider } from './google'
+import type { Provider, WebFontsProviders } from '../types'
 
-export const BunnyFontsProvider = createGoogleCompatibleProvider('bunny', 'https://fonts.bunny.net')
+export function createBunnyFontsProvider(
+  name: WebFontsProviders,
+  host: string,
+): Provider {
+  return {
+    name,
+    getImportUrl(fonts): string {
+      const fontFamilies = fonts.map((font) => {
+        const { name, weights, italic } = font
+        const formattedName = name.toLowerCase().replace(/\s/g, '-')
+        if (!weights?.length) {
+          return `${formattedName}${italic ? ':i' : ''}`
+        }
+        let weightsAsString = weights.sort().map(weight => weight.toString())
+        // 1. if weights have at least one element that has 'i', ignore the `italic` flag.
+        // 2. if none of the weights have an 'i' and italic is true, append an 'i'
+        const weightsHaveItalic = weightsAsString.some(weight => weight.endsWith('i'))
+        if (!weightsHaveItalic && italic)
+          weightsAsString = weightsAsString.map(weight => weight += 'i')
+
+        return `${formattedName}:${weightsAsString.join(',')}`
+      })
+      return `${host}/css?family=${fontFamilies.join('|')}`
+    },
+  }
+}
+
+export const BunnyFontsProvider: Provider = createBunnyFontsProvider(
+  'bunny',
+  'https://fonts.bunny.net',
+)