diff --git a/app/config.php b/app/config.php
index 143a4a6dda4..009c0f586b7 100644
--- a/app/config.php
+++ b/app/config.php
@@ -94,6 +94,7 @@
         'Meta' => \Hyde\Facades\Meta::class,
         'Asset' => \Hyde\Facades\Asset::class,
         'Author' => \Hyde\Facades\Author::class,
+        'HydeFront' => \Hyde\Facades\HydeFront::class,
         'Features' => \Hyde\Facades\Features::class,
         'Config' => \Hyde\Facades\Config::class,
         'Filesystem' => \Hyde\Facades\Filesystem::class,
diff --git a/packages/framework/resources/views/layouts/styles.blade.php b/packages/framework/resources/views/layouts/styles.blade.php
index 497e524ae1b..2a345a4ce18 100644
--- a/packages/framework/resources/views/layouts/styles.blade.php
+++ b/packages/framework/resources/views/layouts/styles.blade.php
@@ -3,7 +3,7 @@
 
 {{-- The compiled Tailwind/App styles --}}
 @if(config('hyde.load_app_styles_from_cdn', false))
-    <link rel="stylesheet" href="{{ Asset::cdnLink('app.css') }}">
+    <link rel="stylesheet" href="{{ HydeFront::cdnLink('app.css') }}">
 @elseif(Asset::hasMediaFile('app.css'))
     <link rel="stylesheet" href="{{ Asset::mediaLink('app.css') }}">
 @endif
diff --git a/packages/framework/src/Facades/Asset.php b/packages/framework/src/Facades/Asset.php
index 49065d3b352..2300dd6dc72 100644
--- a/packages/framework/src/Facades/Asset.php
+++ b/packages/framework/src/Facades/Asset.php
@@ -7,14 +7,8 @@
 use Hyde\Hyde;
 use Illuminate\Support\Str;
 
-use function rtrim;
-use function explode;
-use function implode;
 use function md5_file;
 use function file_exists;
-use function str_replace;
-use function preg_replace;
-use function str_contains;
 use function file_get_contents;
 
 /**
@@ -25,22 +19,6 @@
  */
 class Asset
 {
-    /** @var string The default HydeFront SemVer tag to load. This constant is set to match the styles used for the installed framework version. */
-    final protected const HYDEFRONT_VERSION = 'v3.4';
-
-    /** @var string The default HydeFront CDN path pattern. The Blade-style placeholders are replaced with the proper values. */
-    final protected const HYDEFRONT_CDN_URL = 'https://cdn.jsdelivr.net/npm/hydefront@{{ $version }}/dist/{{ $file }}';
-
-    public static function version(): string
-    {
-        return static::HYDEFRONT_VERSION;
-    }
-
-    public static function cdnLink(string $file): string
-    {
-        return static::constructCdnPath($file);
-    }
-
     public static function mediaLink(string $file): string
     {
         return Hyde::mediaLink($file).static::getCacheBustKey($file);
@@ -69,14 +47,6 @@ public static function injectTailwindConfig(): string
         return preg_replace('/\s+/', ' ', "/* tailwind.config.js */ \n".rtrim($config, ",\n\r"));
     }
 
-    protected static function constructCdnPath(string $file): string
-    {
-        return str_replace(
-            ['{{ $version }}', '{{ $file }}'], [static::version(), $file],
-            static::HYDEFRONT_CDN_URL
-        );
-    }
-
     protected static function getCacheBustKey(string $file): string
     {
         return Config::getBool('hyde.enable_cache_busting', true)
diff --git a/packages/framework/src/Facades/HydeFront.php b/packages/framework/src/Facades/HydeFront.php
new file mode 100644
index 00000000000..b566839b999
--- /dev/null
+++ b/packages/framework/src/Facades/HydeFront.php
@@ -0,0 +1,41 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Hyde\Facades;
+
+use function sprintf;
+
+/**
+ * HydeFront is the NPM package that bundles the default precompiled CSS and JavaScript assets for HydePHP.
+ *
+ * This facade makes it easy to access these assets from the HydeFront CDN, automatically getting the correct version.
+ */
+class HydeFront
+{
+    /** @var string The default HydeFront SemVer tag to load. This constant is set to match the styles used for the installed framework version. */
+    protected const HYDEFRONT_VERSION = 'v3.4';
+
+    /** @var string The default HydeFront CDN path pattern used to assemble CDN links. */
+    protected const HYDEFRONT_CDN_URL = 'https://cdn.jsdelivr.net/npm/hydefront@%s/dist/%s';
+
+    /**
+     * Get the current version of the HydeFront package.
+     *
+     * @return string {@see HYDEFRONT_VERSION}
+     */
+    public static function version(): string
+    {
+        return static::HYDEFRONT_VERSION;
+    }
+
+    /**
+     * Get the CDN link for a specific file.
+     *
+     * @param  'app.css'|'hyde.css'|'hyde.css.map'  $file
+     */
+    public static function cdnLink(string $file): string
+    {
+        return sprintf(static::HYDEFRONT_CDN_URL, static::version(), $file);
+    }
+}
diff --git a/packages/framework/tests/Unit/Facades/AssetFacadeUnitTest.php b/packages/framework/tests/Unit/Facades/AssetFacadeUnitTest.php
index ddfafe2ec72..81cbfc029b4 100644
--- a/packages/framework/tests/Unit/Facades/AssetFacadeUnitTest.php
+++ b/packages/framework/tests/Unit/Facades/AssetFacadeUnitTest.php
@@ -21,19 +21,6 @@ protected function setUp(): void
         self::mockConfig();
     }
 
-    public function testServiceHasVersionString()
-    {
-        $this->assertIsString(Asset::version());
-    }
-
-    public function testCdnLinkHelper()
-    {
-        $this->assertSame(
-            'https://cdn.jsdelivr.net/npm/hydefront@v3.4/dist/styles.css',
-            Asset::cdnLink('styles.css')
-        );
-    }
-
     public function testHasMediaFileHelper()
     {
         $this->assertFalse(Asset::hasMediaFile('styles.css'));
diff --git a/packages/framework/tests/Unit/Facades/HydeFrontFacadeTest.php b/packages/framework/tests/Unit/Facades/HydeFrontFacadeTest.php
new file mode 100644
index 00000000000..fd4336eff3a
--- /dev/null
+++ b/packages/framework/tests/Unit/Facades/HydeFrontFacadeTest.php
@@ -0,0 +1,39 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Hyde\Framework\Testing\Unit\Facades;
+
+use Hyde\Facades\HydeFront;
+use Hyde\Testing\UnitTestCase;
+
+/**
+ * @covers \Hyde\Facades\HydeFront
+ */
+class HydeFrontFacadeTest extends UnitTestCase
+{
+    // Todo: Check the version is correct? (When running in monorepo)
+
+    public function testVersionReturnsString()
+    {
+        $this->assertIsString(HydeFront::version());
+    }
+
+    public function testCdnLinkReturnsCorrectUrl()
+    {
+        $expected = 'https://cdn.jsdelivr.net/npm/hydefront@v3.4/dist/styles.css';
+        $this->assertSame($expected, HydeFront::cdnLink('styles.css'));
+    }
+
+    public function testCdnLinkReturnsCorrectUrlForHydeCss()
+    {
+        $expected = 'https://cdn.jsdelivr.net/npm/hydefront@v3.4/dist/hyde.css';
+        $this->assertSame($expected, HydeFront::cdnLink('hyde.css'));
+    }
+
+    public function testCdnLinkReturnsCorrectUrlForInvalidFile()
+    {
+        $expected = 'https://cdn.jsdelivr.net/npm/hydefront@v3.4/dist/invalid';
+        $this->assertSame($expected, HydeFront::cdnLink('invalid'));
+    }
+}
diff --git a/packages/framework/tests/Unit/Views/StylesComponentViewTest.php b/packages/framework/tests/Unit/Views/StylesComponentViewTest.php
index bfe078d00f1..bb5358f9e08 100644
--- a/packages/framework/tests/Unit/Views/StylesComponentViewTest.php
+++ b/packages/framework/tests/Unit/Views/StylesComponentViewTest.php
@@ -5,7 +5,7 @@
 namespace Hyde\Framework\Testing\Unit\Views;
 
 use Hyde\Facades\Filesystem;
-use Hyde\Facades\Asset;
+use Hyde\Facades\HydeFront;
 use Hyde\Hyde;
 use Hyde\Support\Facades\Render;
 use Hyde\Testing\TestCase;
@@ -80,7 +80,7 @@ public function testComponentRendersTailwindPlayCdnLinkWhenEnabledInConfig()
     public function testComponentRendersAppCdnLinkWhenEnabledInConfig()
     {
         config(['hyde.load_app_styles_from_cdn' => true]);
-        $this->assertStringContainsString(Asset::cdnLink('app.css'), $this->renderTestView());
+        $this->assertStringContainsString(HydeFront::cdnLink('app.css'), $this->renderTestView());
     }
 
     public function testComponentDoesNotRenderLinkToLocalAppCssWhenCdnLinkIsEnabledInConfig()
diff --git a/spec.md b/spec.md
index b404251e8ea..a1ca493ac41 100644
--- a/spec.md
+++ b/spec.md
@@ -15,7 +15,7 @@ For example: Consider these Blade snippets from the default views, showing commo
 ```blade
 {{-- The compiled Tailwind/App styles --}}
 @if(config('hyde.load_app_styles_from_cdn', false))
-    <link rel="stylesheet" href="{{ Asset::cdnLink('app.css') }}">
+    <link rel="stylesheet" href="{{ HydeFront::cdnLink('app.css') }}">
 @elseif(Asset::hasMediaFile('app.css'))
     <link rel="stylesheet" href="{{ Asset::mediaLink('app.css') }}">
 @endif
@@ -61,7 +61,7 @@ protected function setSource(string $source): string {
 ### Asset Facade
 
 ```php
-Asset::cdnLink(string $file) // Gets remote URL to any file in /dist/ in the HydeFront version
+HydeFront::cdnLink(string $file) // Gets remote URL to any file in /dist/ in the HydeFront version
 Asset::mediaLink(string $file) // Returns Hyde::mediaLink but with a cache buster
 Asset::hasMediaFile(string $file) // Returns file_exists(Hyde::mediaPath($file))
 
@@ -576,7 +576,7 @@ $size = $logo->getSize();
 $mimeType = $logo->getMimeType();
 
 // HydeFront CDN link (for app.js or app.css)
-$appJsUrl = Asset::cdnLink('app.js');
+$appJsUrl = HydeFront::cdnLink('app.js');
 ```
 
 This API maintains the simplicity-first approach of Hyde while providing power when needed. It should be intuitive for both Laravel-familiar developers and those new to the framework, aligning well with Hyde's philosophy and goals.