diff --git a/examples/counter/index.html b/examples/counter/index.html
index b5ec4d243..75fa1f12a 100644
--- a/examples/counter/index.html
+++ b/examples/counter/index.html
@@ -2,6 +2,7 @@
 <html>
 	<head>
 		<link data-trunk rel="rust" data-wasm-opt="z"/>
+		<link data-trunk rel="icon" type="image/ico" href="/public/favicon.ico"/>
 	</head>
 	<body></body>
 </html>
\ No newline at end of file
diff --git a/examples/counter/public/favicon.ico b/examples/counter/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/counter/public/favicon.ico differ
diff --git a/examples/counter_isomorphic/Cargo.toml b/examples/counter_isomorphic/Cargo.toml
index 23c5ea5b5..f6bdec566 100644
--- a/examples/counter_isomorphic/Cargo.toml
+++ b/examples/counter_isomorphic/Cargo.toml
@@ -54,7 +54,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 # style-file = "src/styles/tailwind.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-# assets-dir = "static/assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"
 # The port to use for automatic reload monitoring
diff --git a/examples/counter_isomorphic/public/favicon.ico b/examples/counter_isomorphic/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/counter_isomorphic/public/favicon.ico differ
diff --git a/examples/counter_isomorphic/src/counters.rs b/examples/counter_isomorphic/src/counters.rs
index b09613a9c..cf3b15f7b 100644
--- a/examples/counter_isomorphic/src/counters.rs
+++ b/examples/counter_isomorphic/src/counters.rs
@@ -1,5 +1,6 @@
 use leptos::*;
 use leptos_router::*;
+use leptos_meta::*;
 
 #[cfg(feature = "ssr")]
 use std::sync::atomic::{AtomicI32, Ordering};
@@ -44,6 +45,7 @@ pub async fn clear_server_count() -> Result<i32, ServerFnError> {
 }
 #[component]
 pub fn Counters(cx: Scope) -> impl IntoView {
+    provide_meta_context(cx);
     view! {
         cx,
         <Router>
@@ -59,6 +61,7 @@ pub fn Counters(cx: Scope) -> impl IntoView {
                     <li><A href="multi">"Multi-User"</A></li>
                 </ul>
             </nav>
+            <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
             <main>
                 <Routes>
                     <Route path="" view=|cx| view! {
diff --git a/examples/fetch/index.html b/examples/fetch/index.html
index 2854746c4..12c1688d5 100644
--- a/examples/fetch/index.html
+++ b/examples/fetch/index.html
@@ -2,6 +2,7 @@
 <html>
 	<head>
 		<link data-trunk rel="rust" data-wasm-opt="z"/>
+		<link data-trunk rel="icon" type="image/ico" href="/public/favicon.ico"/>
 	</head>
 	<style>
 		img {
diff --git a/examples/fetch/public/favicon.ico b/examples/fetch/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/fetch/public/favicon.ico differ
diff --git a/examples/hackernews/Cargo.toml b/examples/hackernews/Cargo.toml
index 95173ca91..aa870a407 100644
--- a/examples/hackernews/Cargo.toml
+++ b/examples/hackernews/Cargo.toml
@@ -56,7 +56,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 style-file = "./style.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-# assets-dir = "static/assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"	
 # The port to use for automatic reload monitoring
diff --git a/examples/hackernews/public/favicon.ico b/examples/hackernews/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/hackernews/public/favicon.ico differ
diff --git a/examples/hackernews/src/lib.rs b/examples/hackernews/src/lib.rs
index 9a3ce9059..64b5bf4d1 100644
--- a/examples/hackernews/src/lib.rs
+++ b/examples/hackernews/src/lib.rs
@@ -16,6 +16,7 @@ pub fn App(cx: Scope) -> impl IntoView {
         cx,
         <>
             <Stylesheet id="leptos" href="/pkg/hackernews.css"/>
+            <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
             <Meta name="description" content="Leptos implementation of a HackerNews demo."/>
             <Router>
                 <Nav />
diff --git a/examples/hackernews/src/main.rs b/examples/hackernews/src/main.rs
index ce4e0ce53..c65679eab 100644
--- a/examples/hackernews/src/main.rs
+++ b/examples/hackernews/src/main.rs
@@ -14,6 +14,10 @@ cfg_if! {
         async fn css() -> impl Responder {
             actix_files::NamedFile::open_async("./style.css").await
         }
+        #[get("/favicon.ico")]
+        async fn favicon() -> impl Responder {
+            actix_files::NamedFile::open_async("./target/site//favicon.ico").await
+        }
 
         #[actix_web::main]
         async fn main() -> std::io::Result<()> {
@@ -28,6 +32,7 @@ cfg_if! {
 
                 App::new()
                     .service(css)
+                    .service(favicon)
                     .route("/api/{tail:.*}", leptos_actix::handle_server_fns())
                     .leptos_routes(leptos_options.to_owned(), routes.to_owned(), |cx| view! { cx, <App/> })
                     .service(Files::new("/", &site_root))
diff --git a/examples/hackernews_axum/Cargo.toml b/examples/hackernews_axum/Cargo.toml
index 460e61820..dbebe03ef 100644
--- a/examples/hackernews_axum/Cargo.toml
+++ b/examples/hackernews_axum/Cargo.toml
@@ -64,7 +64,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 style-file = "./style.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-# assets-dir = "static/assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"	
 # The port to use for automatic reload monitoring
diff --git a/examples/hackernews_axum/Makefile.toml b/examples/hackernews_axum/Makefile.toml
deleted file mode 100644
index 358cd02c5..000000000
--- a/examples/hackernews_axum/Makefile.toml
+++ /dev/null
@@ -1,4 +0,0 @@
-[tasks.build]
-command = "cargo"
-args = ["+nightly", "build-all-features"]
-install_crate = "cargo-all-features"
diff --git a/examples/hackernews_axum/public/favicon.ico b/examples/hackernews_axum/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/hackernews_axum/public/favicon.ico differ
diff --git a/examples/hackernews_axum/src/lib.rs b/examples/hackernews_axum/src/lib.rs
index c8ae65b84..e1ca4aba2 100644
--- a/examples/hackernews_axum/src/lib.rs
+++ b/examples/hackernews_axum/src/lib.rs
@@ -17,6 +17,7 @@ pub fn App(cx: Scope) -> impl IntoView {
     view! {
         cx,
         <>
+            <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
             <Stylesheet id="leptos" href="/pkg/hackernews_axum.css"/>
             <Meta name="description" content="Leptos implementation of a HackerNews demo."/>
             <Router>
diff --git a/examples/hackernews_axum/src/main.rs b/examples/hackernews_axum/src/main.rs
index 0babc3655..2c568c445 100644
--- a/examples/hackernews_axum/src/main.rs
+++ b/examples/hackernews_axum/src/main.rs
@@ -6,6 +6,7 @@ cfg_if! {
 if #[cfg(feature = "ssr")] {
     use axum::{
         Router,
+        routing::get,
         extract::Extension,
     };
     use leptos_axum::{generate_route_list, LeptosRoutes};
@@ -25,6 +26,7 @@ if #[cfg(feature = "ssr")] {
 
         // build our application with a route
         let app = Router::new()
+        .route("/favicon.ico", get(file_handler))
         .leptos_routes(leptos_options.clone(), routes, |cx| view! { cx, <App/> } )
         .fallback(file_handler)
         .layer(Extension(Arc::new(leptos_options)));
diff --git a/examples/hackernews_axum/static/style.css b/examples/hackernews_axum/static/style.css
deleted file mode 100644
index 95de45e73..000000000
--- a/examples/hackernews_axum/static/style.css
+++ /dev/null
@@ -1,326 +0,0 @@
-body {
-	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-	font-size: 15px;
-	background-color: #f2f3f5;
-	margin: 0;
-	padding-top: 55px;
-	color: #34495e;
-	overflow-y: scroll
-}
-
-a {
-	color: #34495e;
-	text-decoration: none
-}
-
-.header {
-	background-color: #335d92;
-	position: fixed;
-	z-index: 999;
-	height: 55px;
-	top: 0;
-	left: 0;
-	right: 0
-}
-
-.header .inner {
-	max-width: 800px;
-	box-sizing: border-box;
-	margin: 0 auto;
-	padding: 15px 5px
-}
-
-.header a {
-	color: rgba(255, 255, 255, .8);
-	line-height: 24px;
-	transition: color .15s ease;
-	display: inline-block;
-	vertical-align: middle;
-	font-weight: 300;
-	letter-spacing: .075em;
-	margin-right: 1.8em
-}
-
-.header a:hover {
-	color: #fff
-}
-
-.header a.active {
-	color: #fff;
-	font-weight: 400
-}
-
-.header a:nth-child(6) {
-	margin-right: 0
-}
-
-.header .github {
-	color: #fff;
-	font-size: .9em;
-	margin: 0;
-	float: right
-}
-
-.logo {
-	width: 24px;
-	margin-right: 10px;
-	display: inline-block;
-	vertical-align: middle
-}
-
-.view {
-	max-width: 800px;
-	margin: 0 auto;
-	position: relative
-}
-
-.fade-enter-active,
-.fade-exit-active {
-	transition: all .2s ease
-}
-
-.fade-enter,
-.fade-exit-active {
-	opacity: 0
-}
-
-@media (max-width:860px) {
-	.header .inner {
-		padding: 15px 30px
-	}
-}
-
-@media (max-width:600px) {
-	.header .inner {
-		padding: 15px
-	}
-
-	.header a {
-		margin-right: 1em
-	}
-
-	.header .github {
-		display: none
-	}
-}
-
-.news-view {
-	padding-top: 45px
-}
-
-.news-list,
-.news-list-nav {
-	background-color: #fff;
-	border-radius: 2px
-}
-
-.news-list-nav {
-	padding: 15px 30px;
-	position: fixed;
-	text-align: center;
-	top: 55px;
-	left: 0;
-	right: 0;
-	z-index: 998;
-	box-shadow: 0 1px 2px rgba(0, 0, 0, .1)
-}
-
-.news-list-nav .page-link {
-	margin: 0 1em
-}
-
-.news-list-nav .disabled {
-	color: #aaa
-}
-
-.news-list {
-	position: absolute;
-	margin: 30px 0;
-	width: 100%;
-	transition: all .5s cubic-bezier(.55, 0, .1, 1)
-}
-
-.news-list ul {
-	list-style-type: none;
-	padding: 0;
-	margin: 0
-}
-
-@media (max-width:600px) {
-	.news-list {
-		margin: 10px 0
-	}
-}
-
-.news-item {
-	background-color: #fff;
-	padding: 20px 30px 20px 80px;
-	border-bottom: 1px solid #eee;
-	position: relative;
-	line-height: 20px
-}
-
-.news-item .score {
-	color: #335d92;
-	font-size: 1.1em;
-	font-weight: 700;
-	position: absolute;
-	top: 50%;
-	left: 0;
-	width: 80px;
-	text-align: center;
-	margin-top: -10px
-}
-
-.news-item .host,
-.news-item .meta {
-	font-size: .85em;
-	color: #626262
-}
-
-.news-item .host a,
-.news-item .meta a {
-	color: #626262;
-	text-decoration: underline
-}
-
-.news-item .host a:hover,
-.news-item .meta a:hover {
-	color: #335d92
-}
-
-.item-view-header {
-	background-color: #fff;
-	padding: 1.8em 2em 1em;
-	box-shadow: 0 1px 2px rgba(0, 0, 0, .1)
-}
-
-.item-view-header h1 {
-	display: inline;
-	font-size: 1.5em;
-	margin: 0;
-	margin-right: .5em
-}
-
-.item-view-header .host,
-.item-view-header .meta,
-.item-view-header .meta a {
-	color: #626262
-}
-
-.item-view-header .meta a {
-	text-decoration: underline
-}
-
-.item-view-comments {
-	background-color: #fff;
-	margin-top: 10px;
-	padding: 0 2em .5em
-}
-
-.item-view-comments-header {
-	margin: 0;
-	font-size: 1.1em;
-	padding: 1em 0;
-	position: relative
-}
-
-.item-view-comments-header .spinner {
-	display: inline-block;
-	margin: -15px 0
-}
-
-.comment-children {
-	list-style-type: none;
-	padding: 0;
-	margin: 0
-}
-
-@media (max-width:600px) {
-	.item-view-header h1 {
-		font-size: 1.25em
-	}
-}
-
-.comment-children .comment-children {
-	margin-left: 1.5em
-}
-
-.comment {
-	border-top: 1px solid #eee;
-	position: relative
-}
-
-.comment .by,
-.comment .text,
-.comment .toggle {
-	font-size: .9em;
-	margin: 1em 0
-}
-
-.comment .by {
-	color: #626262
-}
-
-.comment .by a {
-	color: #626262;
-	text-decoration: underline
-}
-
-.comment .text {
-	overflow-wrap: break-word
-}
-
-.comment .text a:hover {
-	color: #335d92
-}
-
-.comment .text pre {
-	white-space: pre-wrap
-}
-
-.comment .toggle {
-	background-color: #fffbf2;
-	padding: .3em .5em;
-	border-radius: 4px
-}
-
-.comment .toggle a {
-	color: #626262;
-	cursor: pointer
-}
-
-.comment .toggle.open {
-	padding: 0;
-	background-color: transparent;
-	margin-bottom: -.5em
-}
-
-.user-view {
-	background-color: #fff;
-	box-sizing: border-box;
-	padding: 2em 3em
-}
-
-.user-view h1 {
-	margin: 0;
-	font-size: 1.5em
-}
-
-.user-view .meta {
-	list-style-type: none;
-	padding: 0
-}
-
-.user-view .label {
-	display: inline-block;
-	min-width: 4em
-}
-
-.user-view .about {
-	margin: 1em 0
-}
-
-.user-view .links a {
-	text-decoration: underline
-}
\ No newline at end of file
diff --git a/examples/parent_child/index.html b/examples/parent_child/index.html
index 888f0ba9e..450e590f1 100644
--- a/examples/parent_child/index.html
+++ b/examples/parent_child/index.html
@@ -2,6 +2,7 @@
 <html>
 	<head>
 		<link data-trunk rel="rust" data-wasm-opt="z"/>
+		<link data-trunk rel="icon" type="image/ico" href="/public/favicon.ico"/>
 		<style>
 			.red {
 				color: red;
diff --git a/examples/parent_child/public/favicon.ico b/examples/parent_child/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/parent_child/public/favicon.ico differ
diff --git a/examples/router/index.html b/examples/router/index.html
index b8922a93a..d008fb434 100644
--- a/examples/router/index.html
+++ b/examples/router/index.html
@@ -2,6 +2,7 @@
 <html>
 	<head>
 		<link data-trunk rel="rust" data-wasm-opt="z"/>
+		<link data-trunk rel="icon" type="image/ico" href="/public/favicon.ico"/>
 		<style>
 			a[aria-current] {
 				font-weight: bold;
diff --git a/examples/router/public/favicon.ico b/examples/router/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/router/public/favicon.ico differ
diff --git a/examples/tailwind/Cargo.toml b/examples/tailwind/Cargo.toml
index a47244b85..faa73135e 100644
--- a/examples/tailwind/Cargo.toml
+++ b/examples/tailwind/Cargo.toml
@@ -89,7 +89,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 style-file = "style/output.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-assets-dir = "assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"
 # The port to use for automatic reload monitoring
diff --git a/examples/tailwind/assets/favicon.ico b/examples/tailwind/assets/favicon.ico
deleted file mode 100644
index 43e7b8bcb..000000000
Binary files a/examples/tailwind/assets/favicon.ico and /dev/null differ
diff --git a/examples/tailwind/public/favicon.ico b/examples/tailwind/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/tailwind/public/favicon.ico differ
diff --git a/examples/tailwind/src/app.rs b/examples/tailwind/src/app.rs
index 0a07a53b6..eb243cb41 100644
--- a/examples/tailwind/src/app.rs
+++ b/examples/tailwind/src/app.rs
@@ -11,6 +11,7 @@ pub fn App(cx: Scope) -> impl IntoView {
     view! {
         cx,
         <Stylesheet id="leptos" href="/pkg/tailwind.css"/>
+        <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
         <Router>
             <Routes>
                 <Route path="" view=  move |cx| view! {
diff --git a/examples/todo_app_sqlite/Cargo.toml b/examples/todo_app_sqlite/Cargo.toml
index 6224cc54d..160dd9e04 100644
--- a/examples/todo_app_sqlite/Cargo.toml
+++ b/examples/todo_app_sqlite/Cargo.toml
@@ -58,7 +58,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 style-file = "./style.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-# assets-dir = "static/assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"	
 # The port to use for automatic reload monitoring
diff --git a/examples/todo_app_sqlite/public/favicon.ico b/examples/todo_app_sqlite/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/todo_app_sqlite/public/favicon.ico differ
diff --git a/examples/todo_app_sqlite/src/todo.rs b/examples/todo_app_sqlite/src/todo.rs
index 9dc02fa80..7744314a6 100644
--- a/examples/todo_app_sqlite/src/todo.rs
+++ b/examples/todo_app_sqlite/src/todo.rs
@@ -95,6 +95,7 @@ pub fn TodoApp(cx: Scope) -> impl IntoView {
     provide_meta_context(cx);
     view! {
         cx,
+        <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
         <Stylesheet id="leptos" href="/pkg/todo_app_sqlite.css"/>
         <Router>
             <header>
diff --git a/examples/todo_app_sqlite_axum/Cargo.toml b/examples/todo_app_sqlite_axum/Cargo.toml
index 9ac0b3917..a433b675a 100644
--- a/examples/todo_app_sqlite_axum/Cargo.toml
+++ b/examples/todo_app_sqlite_axum/Cargo.toml
@@ -72,7 +72,7 @@ site-pkg-dir = "pkg"
 # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
 style-file = "./style.css"
 # [Optional] Files in the asset-dir will be copied to the site-root directory
-# assets-dir = "static/assets"
+assets-dir = "public"
 # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
 site-address = "127.0.0.1:3000"	
 # The port to use for automatic reload monitoring
diff --git a/examples/todo_app_sqlite_axum/public/favicon.ico b/examples/todo_app_sqlite_axum/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/todo_app_sqlite_axum/public/favicon.ico differ
diff --git a/examples/todo_app_sqlite_axum/src/todo.rs b/examples/todo_app_sqlite_axum/src/todo.rs
index 78b74c1cc..196866387 100644
--- a/examples/todo_app_sqlite_axum/src/todo.rs
+++ b/examples/todo_app_sqlite_axum/src/todo.rs
@@ -110,7 +110,8 @@ pub fn TodoApp(cx: Scope) -> impl IntoView {
     provide_meta_context(cx);
     view! {
         cx,
-        <Stylesheet id="leptos" href="./pkg/todo_app_sqlite_axum.css"/>
+        <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
+        <Stylesheet id="leptos" href="/pkg/todo_app_sqlite_axum.css"/>
         <Router>
             <header>
                 <h1>"My Tasks"</h1>
diff --git a/examples/todomvc/index.html b/examples/todomvc/index.html
index 55507da21..afacab89e 100644
--- a/examples/todomvc/index.html
+++ b/examples/todomvc/index.html
@@ -7,6 +7,7 @@
 		<link data-trunk rel="css" href="./node_modules/todomvc-app-css/index.css">
 		<title>Leptos • TodoMVC</title>
 		<link data-trunk rel="rust" data-wasm-opt="z"/>
+		<link data-trunk rel="icon" type="image/ico" href="/public/favicon.ico"/>
 	</head>
 	<body></body>
 </html>
\ No newline at end of file
diff --git a/examples/todomvc/public/favicon.ico b/examples/todomvc/public/favicon.ico
new file mode 100644
index 000000000..2ba8527cb
Binary files /dev/null and b/examples/todomvc/public/favicon.ico differ
