diff --git a/src/app/globals.css b/src/app/globals.css
index 6dd80bd..53dafa7 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -13,10 +13,10 @@
         --popover: 0 0% 100%;
         --popover-foreground: 222.2 84% 4.9%;
 
-        --primary: 222.2 47.4% 11.2%;
+        --primary: 240 4% 16%;
         --primary-foreground: 210 40% 98%;
 
-        --secondary: 210 40% 96.1%;
+        --secondary: 0 100% 50%;
         --secondary-foreground: 222.2 47.4% 11.2%;
 
         --muted: 210 40% 96.1%;
@@ -32,6 +32,8 @@
         --input: 214.3 31.8% 91.4%;
         --ring: 222.2 84% 4.9%;
 
+        --console: 240 10% 4%;
+
         --radius: 0.5rem;
     }
 
diff --git a/src/app/page.tsx b/src/app/page.tsx
index dea9c57..7c4d460 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -10,7 +10,7 @@ export default function Home() {
                 className='fixed text-2xl font-mono text-white z-30 w-1/3'
             />
             <div
-                className='relative flex items-end p-8 justify-center left-[35%] h-[110%] -top-1/3 transform rotate-45 overflow-hidden bg-[#183D3D] z-20 border border-[#28282b] transition duration-500 ease-in-out hover:scale-110 hover:text-white text-transparent'
+                className='relative flex items-end p-8 justify-center left-[35%] h-[110%] -top-1/3 transform rotate-45 overflow-hidden bg-[#183D3D] z-20 border border-primary transition duration-500 ease-in-out hover:scale-110 hover:text-white text-transparent'
             >
                 <span
                     className='transform -rotate-45'
diff --git a/src/components/Card/CardFan.tsx b/src/components/Card/CardFan.tsx
index 667268a..46d81cf 100644
--- a/src/components/Card/CardFan.tsx
+++ b/src/components/Card/CardFan.tsx
@@ -96,7 +96,7 @@ const Card: FC<CardProps> = ({title, description, rotate}) => {
     const [cardIsOverlapped, setCardIsOverlapped] = useState(false);
     return (
         <motion.div
-            className={`fixed bg-[#09090b] h-[450px] w-[250px] rounded-lg p-4 border border-[#${cardIsOverlapped ? 'FF0000' : '28282b'}] origin-bottom-left overflow-hidden`}
+            className={`fixed bg-console h-[450px] w-[250px] rounded-lg p-4 border border-${cardIsOverlapped ? 'secondary' : 'primary'} origin-bottom-left overflow-hidden`}
             onMouseOver={() => {
                 setCardIsOverlapped(true);
             }}
@@ -132,7 +132,7 @@ const Card: FC<CardProps> = ({title, description, rotate}) => {
                 {description}
             </p>
             <span
-                className="fixed -bottom-10 -left-8 bg-[#FF0000] h-16 w-12 transform rotate-45 animate-pulse"
+                className="fixed -bottom-10 -left-8 bg-secondary h-16 w-12 transform rotate-45 animate-pulse"
             />
         </motion.div>
     )
diff --git a/src/components/Console/Console.tsx b/src/components/Console/Console.tsx
index 0f3fc09..f7871ad 100644
--- a/src/components/Console/Console.tsx
+++ b/src/components/Console/Console.tsx
@@ -16,7 +16,7 @@ export const Console: FC<FadeInProps> = ({children}) => {
     useCloseConsole(5000);
     return (
         <motion.div
-            className={`absolute inset-0 bg-[#09090b] rounded-lg border border-[#28282b] overflow-hidden h-full w-full ${isWindowReduced && "cursor-pointer"}`}
+            className={`absolute inset-0 bg-[#09090b] rounded-lg border border-primary overflow-hidden h-full w-full ${isWindowReduced && "cursor-pointer"}`}
             onClick={isWindowReduced ? () => setIsWindowReduced(false) : undefined}
             animate={{
                 scale: isConsoleClosed ? .9 : 1,
diff --git a/src/components/Console/ConsoleBackground.tsx b/src/components/Console/ConsoleBackground.tsx
index eede436..4a1016b 100644
--- a/src/components/Console/ConsoleBackground.tsx
+++ b/src/components/Console/ConsoleBackground.tsx
@@ -13,7 +13,7 @@ export const ConsoleBackground: FC<ConsoleBackgroundProps> = ({children}) => {
     return (
         <>
             <motion.div
-                className={`relative h-full w-full rounded-lg overflow-hidden bg-black border ${isConsoleClosed || isWindowReduced ? 'border-[#FF0000]' : 'border-[#28282b]'}`}
+                className={`relative h-full w-full rounded-lg overflow-hidden bg-black ${isConsoleClosed || isWindowReduced && 'border border-secondary'}`}
                 initial={{
                     opacity: 0,
                     y: "-100%"
diff --git a/src/components/Console/ConsoleFooter.tsx b/src/components/Console/ConsoleFooter.tsx
index 2ab08ee..dd1a9d2 100644
--- a/src/components/Console/ConsoleFooter.tsx
+++ b/src/components/Console/ConsoleFooter.tsx
@@ -14,7 +14,7 @@ export const ConsoleFooter: FC<ConsoleFooterProps> = () => {
     const parentRef = useRef<HTMLDivElement>(null);
     return (
         <div
-            className='flex fixed bottom-0 w-full border-t border-[#28282b] h-8 items-center overflow-hidden z-20 text-[12px] font-thin bg-[#09090b]'
+            className='flex fixed bottom-0 w-full border-t border-primary h-8 items-center overflow-hidden z-20 text-[12px] font-thin bg-console'
             ref={parentRef}
         >
             <Halo
@@ -24,18 +24,23 @@ export const ConsoleFooter: FC<ConsoleFooterProps> = () => {
                 parentRef={parentRef}
             />
             <div
-                className='px-2 h-full border-r border-[#28282b] flex items-center w-fit space-x-2'
+                className='px-2 h-full border-r border-primary flex items-center w-fit space-x-2'
             >
                 <GitBranchIcon
                     size={15}
-                    color='#FF0000'
+                    className='text-secondary'
                 />
-                <span>
-                    main
-                </span>
+                <Link
+                    href='https://github.com/JowaDev/resume'
+                    target='_blank'
+                >
+                    <span>
+                        master
+                    </span>
+                </Link>
             </div>
             <div
-                className='px-2 h-full flex items-center w-fit space-x-2 border-r border-[#28282b]'
+                className='px-2 h-full flex items-center w-fit space-x-2 border-r border-primary'
             >
                 <motion.span
                     whileHover={{
@@ -48,12 +53,12 @@ export const ConsoleFooter: FC<ConsoleFooterProps> = () => {
                 >
                     <RefreshCcwIcon
                         size={15}
-                        color='#FF0000'
+                        className='text-secondary'
                     />
                 </motion.span>
             </div>
             <div
-                className='px-2 h-full flex items-center w-fit space-x-2 border-r border-[#28282b]'
+                className='px-2 h-full flex items-center w-fit space-x-2 border-r border-primary'
             >
                 <Link
                     href='https://eu.umami.is/share/mhcJrIxVskrjqxV1/resume.jowa.dev'
@@ -61,7 +66,7 @@ export const ConsoleFooter: FC<ConsoleFooterProps> = () => {
                 >
                     <AreaChartIcon
                         size={15}
-                        color='#FF0000'
+                        className='text-secondary'
                     />
                 </Link>
             </div>
diff --git a/src/components/Console/ConsoleHeader.tsx b/src/components/Console/ConsoleHeader.tsx
index d4eabf6..0ec9fb5 100644
--- a/src/components/Console/ConsoleHeader.tsx
+++ b/src/components/Console/ConsoleHeader.tsx
@@ -14,7 +14,7 @@ export const ConsoleHeader: FC<ConsoleProps> = () => {
     const {setIsWindowReduced, setIsConsoleClosed} = useContext(globalContext);
     return (
         <div
-            className='relative grid grid-cols-12 border-b border-[#28282b] h-12 items-center px-[16px] overflow-hidden'
+            className='relative grid grid-cols-12 border-b border-primary h-12 items-center px-[16px] overflow-hidden'
             ref={parentRef}
         >
             <Halo
@@ -24,23 +24,22 @@ export const ConsoleHeader: FC<ConsoleProps> = () => {
                 parentRef={parentRef}
             />
             <div
-                className='col-span-3 flex items-center border-r border-[#28282b] h-full cursor-default text-white'
+                className='col-span-3 flex items-center border-r border-primary h-full cursor-default text-white'
             >
                 <ChevronRight
-                    color='#FF0000'
-                    className='animate-pulse'
+                    className='animate-pulse text-secondary'
                 />
                 JowaDev
             </div>
             <div
-                className='col-span-2 flex justify-center items-center border-r border-[#28282b] h-full'
+                className='col-span-2 flex justify-center items-center border-r border-primary h-full'
             >
                 <NavLink
                     word={'_welcome'}
                 />
             </div>
             <div
-                className='col-span-2 flex justify-center items-center border-r border-[#28282b] h-full'
+                className='col-span-2 flex justify-center items-center border-r border-primary h-full'
             >
                 <NavLink
                     word={'_about-me'}
@@ -48,7 +47,7 @@ export const ConsoleHeader: FC<ConsoleProps> = () => {
                 />
             </div>
             <div
-                className='col-span-2 flex justify-center items-center border-r border-[#28282b] h-full'
+                className='col-span-2 flex justify-center items-center border-r border-primary h-full'
             >
                 <NavLink
                     word={'_portfolio'}
@@ -57,14 +56,14 @@ export const ConsoleHeader: FC<ConsoleProps> = () => {
                 />
             </div>
             <span
-                className='absolute flex items-center inset-y-0 top-1/2 right-[25px] transform -translate-y-1/2 h-3 w-3 bg-[#FF0000] rounded-full cursor-pointer'
+                className='absolute flex items-center top-1/2 right-[25px] transform -translate-y-1/2 h-3 w-3 bg-secondary rounded-full cursor-pointer animate-pulse'
                 onClick={() => setIsConsoleClosed(prevState => !prevState)}
             />
             <span
-                className='absolute flex items-center inset-y-0 top-1/2 right-[45px] transform -translate-y-1/2 h-3 w-3 bg-green-600 rounded-full'
+                className='absolute flex items-center top-1/2 right-[45px] transform -translate-y-1/2 h-3 w-3 bg-green-600 rounded-full'
             />
             <span
-                className='absolute flex items-center inset-y-0 top-1/2 right-[65px] transform -translate-y-1/2 h-3 w-3 bg-gray-600 rounded-full cursor-pointer'
+                className='absolute flex items-center top-1/2 right-[65px] transform -translate-y-1/2 h-3 w-3 bg-gray-600 rounded-full cursor-pointer animate-pulse'
                 onClick={() => setIsWindowReduced(prevState => !prevState)}
             />
         </div>
diff --git a/src/components/Effect/TypeWritterEffect.tsx b/src/components/Effect/TypeWritterEffect.tsx
index d73838a..e4b79e7 100644
--- a/src/components/Effect/TypeWritterEffect.tsx
+++ b/src/components/Effect/TypeWritterEffect.tsx
@@ -39,7 +39,7 @@ const CursorBlinker = () => {
         <motion.div
             variants={cursorVariants}
             animate="blinking"
-            className="inline-block h-6 w-[1px] translate-y-1 bg-[#FF0000]"
+            className="inline-block h-6 w-[1px] translate-y-1 bg-secondary"
         />
     );
 }
\ No newline at end of file
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 3dc6ce4..3ed1e93 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -52,6 +52,9 @@ const config = {
                     DEFAULT: "hsl(var(--card))",
                     foreground: "hsl(var(--card-foreground))",
                 },
+                console: {
+                    DEFAULT: "hsl(var(--console))",
+                },
             },
             borderRadius: {
                 lg: "var(--radius)",