diff --git a/.changeset/late-owls-press.md b/.changeset/late-owls-press.md
new file mode 100644
index 000000000..81ddfe78d
--- /dev/null
+++ b/.changeset/late-owls-press.md
@@ -0,0 +1,5 @@
+---
+"@tabler/core": patch
+---
+
+Add different favicon to development environment
diff --git a/docs/public/favicon-dev.ico b/docs/public/favicon-dev.ico
new file mode 100644
index 000000000..596394062
Binary files /dev/null and b/docs/public/favicon-dev.ico differ
diff --git a/preview/eleventy.config.mjs b/preview/eleventy.config.mjs
index 2938b82e8..9595d3b9f 100644
--- a/preview/eleventy.config.mjs
+++ b/preview/eleventy.config.mjs
@@ -22,6 +22,7 @@ export default function (eleventyConfig) {
 	eleventyConfig.addPassthroughCopy({
 		"node_modules/@tabler/core/dist": "dist",
 		"pages/favicon.ico": "favicon.ico",
+		"pages/favicon-dev.ico": "favicon-dev.ico",
 		"static": "static",
 	});
 
diff --git a/preview/pages/favicon-dev.ico b/preview/pages/favicon-dev.ico
new file mode 100644
index 000000000..596394062
Binary files /dev/null and b/preview/pages/favicon-dev.ico differ
diff --git a/shared/layouts/base.html b/shared/layouts/base.html
index 530acec47..a7b1913cc 100644
--- a/shared/layouts/base.html
+++ b/shared/layouts/base.html
@@ -22,14 +22,17 @@
 		<meta name="HandheldFriendly" content="True"/>
 		<meta name="MobileOptimized" content="320"/>
 
-		<link rel="icon" href="{{ page | relative }}/favicon.ico" type="image/x-icon"/>
+		<link rel="icon" href="{{ page | relative }}/favicon.ico" type="image/x-icon" />
 		<link rel="shortcut icon" href="{{ page | relative }}/favicon.ico" type="image/x-icon"/>
-
 		<meta name="description" content="{{ description | default: site.description | escape }}"/>
 
 		{% include "layout/og.html" %}
+	{% elsif environment == 'development' %}
+		<link rel="icon" href="{{ page | relative }}/favicon-dev.ico" type="image/x-icon" />
+		<link rel="shortcut icon" href="{{ page | relative }}/favicon-dev.ico" type="image/x-icon" />
 	{% endif %}
 
+
 	{% include "layout/css.html" %}
 	{% include "layout/js-libs.html" head %}
 
diff --git a/shared/layouts/docs/default.html b/shared/layouts/docs/default.html
index ca5d2b87b..f5a124241 100644
--- a/shared/layouts/docs/default.html
+++ b/shared/layouts/docs/default.html
@@ -5,30 +5,32 @@
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+	{% if environment == 'preview' %}
+	
 	{% assign pageSection = "" %}
 	{% if page.url contains "/ui/" %}
-	  {% assign pageSection = "UI" %}
+	{% assign pageSection = "UI" %}
 	{% elsif page.url contains "/icons/" %}
-	  {% assign pageSection = "Icons" %}
+	{% assign pageSection = "Icons" %}
 	{% elsif page.url contains "/illustrations/" %}
-	  {% assign pageSection = "Illustrations" %}
+	{% assign pageSection = "Illustrations" %}
 	{% elsif page.url contains "/emails/" %}
-	  {% assign pageSection = "Emails" %}
+	{% assign pageSection = "Emails" %}
 	{% endif %}
 
 	{% assign metaTitle = title %}
 	{% if seoTitle %}
-	  {% assign metaTitle = seoTitle %}
+	{% assign metaTitle = seoTitle %}
 	{% endif %}
 
 	{% assign metaDescription = description %}
 	{% if seoDescription %}
-	  {% assign metaDescription = seoDescription %}
+	{% assign metaDescription = seoDescription %}
 	{% endif %}
 
 	{% assign siteName = "Tabler Documentation" %}
 	{% if pageSection != "" %}
-	  {% assign siteName = "Tabler " | append: pageSection | append: " Documentation" %}
+	{% assign siteName = "Tabler " | append: pageSection | append: " Documentation" %}
 	{% endif %}
 
 	<title>{{ metaTitle }} | {{ siteName }}</title>
@@ -48,6 +50,11 @@
 
 	<script defer data-api="/stats/event" data-domain="docs.tabler.io" src="/stats/js/script.js"></script>
 
+	{% elsif environment == 'development' %}
+	<link rel="icon" href="{{ page | relative }}/favicon-dev.ico" type="image/x-icon" />
+	<link rel="shortcut icon" href="{{ page | relative }}/favicon-dev.ico" type="image/x-icon" />
+	{% endif %}
+
 	<link rel="stylesheet" href="/dist/css/tabler{% if environment != 'development' %}.min{% endif %}.css{% if environment != 'development' %}?{{ 'now' | date: '%s' }}{% endif %}" />
 	{% for plugin in site.cssPlugins %}
 	<link