diff --git a/public/assets/dark.css b/public/assets/dark.css
index a4b81bd..b6ec3e2 100644
--- a/public/assets/dark.css
+++ b/public/assets/dark.css
@@ -16,4 +16,14 @@
 	--background-btn-link: var(--color-gray-800);
 	--background-btn-link-active: var(--color-gray-700);
 	--background-inputs-color: var(--color-gray-800);
+
+	/* Icons */
+	--icon-primary: var(--color-white);
+	--icon-secondary: var(--color-gray-100);
+	--icon-filter: invert(100%);
+}
+
+.header svg,
+.site-content svg {
+	filter: var(--icon-filter);
 }
diff --git a/public/assets/light.css b/public/assets/light.css
index 7e40887..1daf165 100644
--- a/public/assets/light.css
+++ b/public/assets/light.css
@@ -16,4 +16,8 @@
 	--background-btn-link: var(--color-white);
 	--background-btn-link-active: var(--color-white);
 	--background-inputs-color: var(--color-white);
+
+	/* Icons */
+	--icon-primary: var(--color-white);
+	--icon-secondary: var(--color-gray-700);
 }
diff --git a/src/components/ContactsList/ContactsList.scss b/src/components/ContactsList/ContactsList.scss
index 9619d4a..feec5f3 100644
--- a/src/components/ContactsList/ContactsList.scss
+++ b/src/components/ContactsList/ContactsList.scss
@@ -8,4 +8,8 @@
 		display: flex;
 		column-gap: 5px;
 	}
+
+	& svg {
+		filter: none;
+	}
 }
diff --git a/src/components/Header/Header.scss b/src/components/Header/Header.scss
index 40bbdf9..b3e246e 100644
--- a/src/components/Header/Header.scss
+++ b/src/components/Header/Header.scss
@@ -65,55 +65,51 @@
 		}
 	}
 	&__button {
-		cursor: pointer;
-		width: 30px;
-		height: 21px;
-		position: relative;
-		transform: rotate(0deg);
-		background: none;
-		border: none;
-		&:hover {
-			border: none;
-			opacity: var(--opacity-hover);
-		}
-		& span {
-			pointer-events: none;
-			display: block;
-			position: absolute;
-			height: 3px;
-			width: 100%;
-			background: var(--font-color);
-			border-radius: 7px;
-			opacity: 1;
-			left: 0;
-		}
-		& span:nth-child(1) {
-			top: 2px;
-			transform-origin: left center;
-		}
-		& span:nth-child(2) {
-			top: 9px;
-			transform-origin: left center;
-		}
-		& span:nth-child(3) {
-			top: 16px;
-			transform-origin: left center;
-		}
-		&[aria-pressed='true'] {
-			& span:nth-child(1) {
-				transform: rotate(45deg);
-				top: -1px;
-				left: 5px;
-			}
-			& span:nth-child(2) {
-				display: none;
-			}
-			& span:nth-child(3) {
-				transform: rotate(-45deg);
-				top: 20px;
-				left: 5px;
-			}
-		}
+		// cursor: pointer;
+		// background: none;
+		// border: none;
+		// &:hover {
+		// 	border: none;
+		// 	opacity: var(--opacity-hover);
+		// }
+		// & span {
+		// 	pointer-events: none;
+		// 	display: block;
+		// 	position: absolute;
+		// 	height: 3px;
+		// 	width: 100%;
+		// 	background: var(--font-color);
+		// 	border-radius: 7px;
+		// 	opacity: 1;
+		// 	left: 0;
+		// }
+		// & span:nth-child(1) {
+		// 	top: 2px;
+		// 	transform-origin: left center;
+		// }
+		// & span:nth-child(2) {
+		// 	top: 9px;
+		// 	transform-origin: left center;
+		// }
+		// & span:nth-child(3) {
+		// 	top: 16px;
+		// 	transform-origin: left center;
+		// }
+		// &[aria-pressed='true'] {
+		// 	& span:nth-child(1) {
+		// 		transform: rotate(45deg);
+		// 		top: -1px;
+		// 		left: 5px;
+		// 	}
+		// 	& span:nth-child(2) {
+		// 		display: none;
+		// 	}
+		// 	& span:nth-child(3) {
+		// 		transform: rotate(-45deg);
+		// 		top: 20px;
+		// 		left: 5px;
+		// 	}
+		// }
 	}
 }
 
@@ -160,7 +156,7 @@
 					justify-content: center;
 				}
 			}
-			&__button {
+			& .nav-toggle {
 				position: absolute;
 				right: var(--content-padding);
 			}
diff --git a/src/components/Header/NavToggle/NavToggle.scss b/src/components/Header/NavToggle/NavToggle.scss
index a708442..7ca42f4 100644
--- a/src/components/Header/NavToggle/NavToggle.scss
+++ b/src/components/Header/NavToggle/NavToggle.scss
@@ -1,5 +1,17 @@
+.nav-toggle {
+	display: flex;
+	padding: 0;
+	cursor: pointer;
+	// background: none;
+	border: none;
+	&:hover {
+		border: none;
+		opacity: var(--opacity-hover);
+	}
+}
+
 @media screen and (min-width: 769px) {
-	#nav-toggle {
+	.nav-toggle {
 		display: none;
 	}
 }
diff --git a/src/components/Header/NavToggle/NavToggle.tsx b/src/components/Header/NavToggle/NavToggle.tsx
index e858b7f..e8ca43a 100644
--- a/src/components/Header/NavToggle/NavToggle.tsx
+++ b/src/components/Header/NavToggle/NavToggle.tsx
@@ -3,6 +3,23 @@ import type { Component } from 'solid-js';
 import { createSignal, createEffect } from 'solid-js';
 import './NavToggle.scss';
 
+const MenuIcon: Component = () => (
+	<svg width="28" height="28" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path d="M21 6V8H3V6H21ZM3 18H21V16H3V18ZM3 13H21V11H3V13Z" fill="black" />
+	</svg>
+);
+
+const CloseIcon: Component = () => (
+	<svg width="28" height="28" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			fill-rule="evenodd"
+			clip-rule="evenodd"
+			d="M12.0002 13.0605L17.4692 18.531L18.5312 17.4705L13.0607 12L18.5312 6.53099L17.4707 5.46899L12.0002 10.9395L6.5312 5.46899L5.4707 6.53099L10.9397 12L5.4707 17.469L6.5312 18.531L12.0002 13.0605Z"
+			fill="black"
+		/>
+	</svg>
+);
+
 const NavToggle: Component = () => {
 	const [isNavShown, setIsNavShown] = createSignal<boolean>(false);
 
@@ -20,10 +37,8 @@ const NavToggle: Component = () => {
 	});
 
 	return (
-		<button id="nav-toggle" class="header__button" onClick={toggleNav} type="button" aria-pressed={isNavShown() ? 'true' : 'false'} aria-label="Menu">
-			<span />
-			<span />
-			<span />
+		<button class="nav-toggle" onClick={toggleNav} type="button" aria-pressed={isNavShown()} aria-label="Menu">
+			{isNavShown() ? <CloseIcon /> : <MenuIcon />}
 		</button>
 	);
 };
diff --git a/src/components/SearchInput/SearchInput.scss b/src/components/SearchInput/SearchInput.scss
index 1ba730e..a6ffffa 100644
--- a/src/components/SearchInput/SearchInput.scss
+++ b/src/components/SearchInput/SearchInput.scss
@@ -9,7 +9,9 @@
 		position: absolute;
 		left: 8px;
 		fill: var(--font-color-grayer);
+		filter: none;
 	}
+
 	& input {
 		padding-left: 40px;
 		color: var(--font-color-gray);
diff --git a/src/icons/email.svg b/src/icons/email.svg
index 0983d16..7b38190 100644
--- a/src/icons/email.svg
+++ b/src/icons/email.svg
@@ -1,6 +1,6 @@
 <svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_378_210)">
-<path d="M13.1464 11.4548C13.1464 12.2108 13.3615 12.5123 13.924 12.5123C15.1777 12.5123 15.976 10.9148 15.976 8.258C15.976 4.1972 13.0168 2.2532 9.32232 2.2532C5.52162 2.2532 2.06472 4.802 2.06472 9.6188C2.06472 14.2196 5.08872 16.7252 9.73272 16.7252C11.3095 16.7252 12.3679 16.5524 13.987 16.0124L14.3344 17.4587C12.736 17.978 11.0278 18.1283 9.71112 18.1283C3.61992 18.1283 0.357422 14.7803 0.357422 9.6179C0.357422 4.4123 4.13832 0.8699 9.34392 0.8699C14.7655 0.8699 17.6374 4.1099 17.6374 8.0843C17.6374 11.4539 16.5799 14.0243 13.2535 14.0243C11.7406 14.0243 10.7479 13.4195 10.6183 12.0794C10.2295 13.5698 9.19272 14.0243 7.78782 14.0243C5.90862 14.0243 4.33182 12.5762 4.33182 9.6611C4.33182 6.7235 5.71512 4.9091 8.19912 4.9091C9.51672 4.9091 10.3375 5.4275 10.7029 6.2483L11.3302 5.1035H13.1446V11.4548H13.1464V11.4548ZM10.4905 8.6036C10.4905 7.4165 9.60402 6.9188 8.86962 6.9188C8.07042 6.9188 7.18572 7.5659 7.18572 9.4676C7.18572 10.9796 7.85532 11.822 8.86962 11.822C9.58242 11.822 10.4905 11.3684 10.4905 10.1156V8.6036Z" fill="#010409"/>
+<path d="M13.1464 11.4548C13.1464 12.2108 13.3615 12.5123 13.924 12.5123C15.1777 12.5123 15.976 10.9148 15.976 8.258C15.976 4.1972 13.0168 2.2532 9.32232 2.2532C5.52162 2.2532 2.06472 4.802 2.06472 9.6188C2.06472 14.2196 5.08872 16.7252 9.73272 16.7252C11.3095 16.7252 12.3679 16.5524 13.987 16.0124L14.3344 17.4587C12.736 17.978 11.0278 18.1283 9.71112 18.1283C3.61992 18.1283 0.357422 14.7803 0.357422 9.6179C0.357422 4.4123 4.13832 0.8699 9.34392 0.8699C14.7655 0.8699 17.6374 4.1099 17.6374 8.0843C17.6374 11.4539 16.5799 14.0243 13.2535 14.0243C11.7406 14.0243 10.7479 13.4195 10.6183 12.0794C10.2295 13.5698 9.19272 14.0243 7.78782 14.0243C5.90862 14.0243 4.33182 12.5762 4.33182 9.6611C4.33182 6.7235 5.71512 4.9091 8.19912 4.9091C9.51672 4.9091 10.3375 5.4275 10.7029 6.2483L11.3302 5.1035H13.1446V11.4548H13.1464V11.4548ZM10.4905 8.6036C10.4905 7.4165 9.60402 6.9188 8.86962 6.9188C8.07042 6.9188 7.18572 7.5659 7.18572 9.4676C7.18572 10.9796 7.85532 11.822 8.86962 11.822C9.58242 11.822 10.4905 11.3684 10.4905 10.1156V8.6036Z" fill="black"/>
 </g>
 <defs>
 <clipPath id="clip0_378_210">
diff --git a/src/icons/socket-io.svg b/src/icons/socket-io.svg
index 6d13e60..b68bfc4 100644
--- a/src/icons/socket-io.svg
+++ b/src/icons/socket-io.svg
@@ -1,11 +1,9 @@
 <svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_355_422)">
-<path d="M8.03531 0.576701C10.5562 -0.0697833 13.3423 0.306935 15.5655 1.67904C18.3655 3.3535 20.1934 6.52092 20.2399 9.78139C20.3423 13.0744 18.6259 16.3395 15.8678 18.1302C12.798 20.1953 8.55156 20.2744 5.41664 18.3116C2.22132 16.4046 0.356169 12.5581 0.835309 8.86506C1.22125 4.96272 4.23531 1.52092 8.03531 0.576779V0.576701Z" fill="#010101"/>
-<path d="M7.64851 2.1721C12.4113 0.26507 18.2532 3.78601 18.7462 8.89304C19.5137 13.4884 15.6997 18.1581 11.0438 18.293C6.61593 18.7349 2.33687 14.9813 2.21133 10.5349C1.88109 6.93491 4.2532 3.3628 7.64851 2.1721Z" fill="white"/>
-<path d="M8.12824 9.50703C10.2632 7.76281 12.3515 5.95812 14.5329 4.26508C13.3887 6.02328 12.212 7.75812 11.0678 9.51625C10.0864 9.52093 9.10504 9.52094 8.12824 9.50695V9.50703ZM9.93293 10.4791C10.9189 10.4791 11.9004 10.4791 12.8818 10.493C10.7329 12.2279 8.65387 14.0465 6.46777 15.7349C7.61199 13.9767 8.78871 12.2373 9.93293 10.4791Z" fill="#010101"/>
+<g clip-path="url(#clip0_753_2)">
+<path d="M10.4463 0.0116577C9.6101 0.0140479 8.77739 0.119851 7.96715 0.326658C4.06715 1.29582 0.972981 4.82832 0.575481 8.83499C0.0838144 12.625 1.99965 16.5725 5.27881 18.53C8.49631 20.545 12.8563 20.4633 16.0071 18.3442C18.838 16.5058 20.6005 13.1542 20.4955 9.77332C20.4471 6.42666 18.5705 3.17666 15.6955 1.45666C14.1288 0.490824 12.2863 0.00499105 10.4471 0.012491L10.4463 0.0116577ZM10.3938 1.42499C14.5146 1.41916 18.5513 4.60249 18.9621 8.86166C19.7496 13.5783 15.8346 18.3725 11.0555 18.5117C6.51048 18.965 2.11881 15.1117 1.98881 10.5475C1.65048 6.85249 4.08631 3.18499 7.57048 1.96416C8.46874 1.60663 9.42702 1.42392 10.3938 1.42582V1.42499ZM14.6363 4.11166C12.3971 5.84916 10.253 7.70166 8.06215 9.49249C9.06465 9.50666 10.0721 9.50582 11.0796 9.50082C12.2546 7.69666 13.463 5.91749 14.6363 4.11166ZM9.91548 10.49C8.74048 12.295 7.53215 14.0808 6.35715 15.885C8.60131 14.1517 10.7363 12.285 12.9421 10.505C11.9333 10.4928 10.9244 10.4878 9.91548 10.49V10.49Z" fill="#010101"/>
 </g>
 <defs>
-<clipPath id="clip0_355_422">
+<clipPath id="clip0_753_2">
 <rect width="20" height="20" fill="white" transform="translate(0.5)"/>
 </clipPath>
 </defs>
diff --git a/src/styles/global.scss b/src/styles/global.scss
index 18c6507..b6d7302 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -211,10 +211,12 @@ button {
 	font-family: var(--font-family-base);
 	font-weight: 500;
 	font-size: var(--font-size-md);
-	padding: 5px 17px;
+	color: var(--font-color);
+	padding: 4px 16px;
 	border: 1px solid var(--border-color);
 	border-radius: var(--border-radius-md);
 	background: none;
+	font-size: var(--font-size-sm);
 	&:hover {
 		border: 1px solid var(--border-color-hover);
 	}