diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
new file mode 100644
index 00000000..03d9549e
--- /dev/null
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+  </profile>
+</component>
\ No newline at end of file
diff --git a/.idea/prettier.xml b/.idea/prettier.xml
new file mode 100644
index 00000000..b0c1c68f
--- /dev/null
+++ b/.idea/prettier.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="PrettierConfiguration">
+    <option name="myConfigurationMode" value="AUTOMATIC" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/components/layout/Header.tsx b/components/layout/Header.tsx
index fb9bfeeb..7a8eddbc 100644
--- a/components/layout/Header.tsx
+++ b/components/layout/Header.tsx
@@ -141,7 +141,7 @@ const Header = () => {
                     className='flex items-center transition-colors duration-200 hover:text-[var(--accent-color)]'
                     style={{ color: 'var(--fc-primary)' }}
                   >
-                    <span className='font-medium hover:text-purple-400'>Languages</span>
+                    <span className='font-medium hover:text-blue-400'>Languages</span>
                     <svg
                       className={`ml-1 h-4 w-4 transition-transform duration-200 ${isLanguageDropdownOpen ? 'rotate-180' : ''}`}
                       fill='none'
@@ -189,7 +189,7 @@ const Header = () => {
                     className='flex items-center transition-colors duration-200 hover:text-[var(--accent-color)]'
                     style={{ color: 'var(--fc-primary)' }}
                   >
-                    <span className='font-medium hover:text-purple-400'>Frameworks</span>
+                    <span className='font-medium hover:text-blue-400'>Frameworks</span>
                     <svg
                       className={`ml-1 h-4 w-4 transition-transform duration-200 ${isFrameworkDropdownOpen ? 'rotate-180' : ''}`}
                       fill='none'
@@ -237,7 +237,7 @@ const Header = () => {
                     className='flex items-center transition-colors duration-200 hover:text-[var(--accent-color)]'
                     style={{ color: 'var(--fc-primary)' }}
                   >
-                    <span className='font-medium hover:text-purple-400'>Git</span>
+                    <span className='font-medium hover:text-blue-400'>Git</span>
                     <svg
                       className={`ml-1 h-4 w-4 transition-transform duration-200 ${isGitSelectionDropdownOpen ? 'rotate-180' : ''}`}
                       fill='none'
@@ -285,7 +285,7 @@ const Header = () => {
                     className='flex items-center transition-colors duration-200 hover:text-[var(--accent-color)]'
                     style={{ color: 'var(--fc-primary)' }}
                   >
-                    <span className='font-medium hover:text-purple-400'>Roadmap</span>
+                    <span className='font-medium hover:text-blue-400'>Roadmap</span>
                     <svg
                       className={`ml-1 h-4 w-4 transition-transform duration-200 ${isRoadmapDropdownOpen ? 'rotate-180' : ''}`}
                       fill='none'
@@ -331,13 +331,13 @@ const Header = () => {
             <div className='flex items-center space-x-4'>
               <Link
                 href='/community/contributors'
-                className='rounded-md px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-100 hover:text-purple-400'
+                className='rounded-md px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-100 hover:text-blue-400'
               >
                 Contributors
               </Link>
               <Link
                 href='/help/faq'
-                className='rounded-md px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-100 hover:text-purple-400'
+                className='rounded-md px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-100 hover:text-blue-400'
               >
                 FAQ
               </Link>
@@ -348,7 +348,7 @@ const Header = () => {
                 href='https://github.com/fork-commit-merge/fork-commit-merge'
                 target='_blank'
                 rel='noopener noreferrer'
-                className='flex items-center pl-3 text-gray-700 transition-colors hover:text-modern-purple'
+                className='flex items-center pl-3 text-gray-700 transition-colors hover:text-modern-blue'
               >
                 <svg
                   className='mr-1 h-5 w-5'
diff --git a/components/layout/LoadingPage.tsx b/components/layout/LoadingPage.tsx
index 1f48ebb0..b3306664 100644
--- a/components/layout/LoadingPage.tsx
+++ b/components/layout/LoadingPage.tsx
@@ -44,7 +44,7 @@ const LoadingPage = () => {
           initial={{ opacity: 0 }}
           animate={{ opacity: 1 }}
           transition={{ delay: 0.3 }}
-          className="text-4xl font-bold mb-4 text-modern-purple"
+          className="text-4xl font-bold mb-4 text-modern-blue"
         >
           Welcome to Fork, Commit, Merge
         </motion.h1>
diff --git a/components/ui/ThemeSelector.tsx b/components/ui/ThemeSelector.tsx
index 68b6a0c1..6576d39b 100644
--- a/components/ui/ThemeSelector.tsx
+++ b/components/ui/ThemeSelector.tsx
@@ -21,7 +21,7 @@ const ThemeSelector = () => {
   return (
     <button
       onClick={toggleTheme}
-      className='text-text-1 hover:bg-background-2 focus:ring-primary flex items-center space-x-2 rounded-md px-3 py-2 text-sm font-medium focus:outline-none focus:ring-2 hover:text-purple-400'
+      className='text-text-1 hover:bg-background-2 focus:ring-primary flex items-center space-x-2 rounded-md px-3 py-2 text-sm font-medium focus:outline-none focus:ring-2 hover:text-blue-400'
     >
       {theme === 'dark' ? (
         <SunIcon className='h-5 w-5' />
diff --git a/pages/ai/ai.tsx b/pages/ai/ai.tsx
index 5f80691a..c44cbe25 100644
--- a/pages/ai/ai.tsx
+++ b/pages/ai/ai.tsx
@@ -27,7 +27,7 @@ export default function AI() {
             className='text-center'
           >
             <h1 className='text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl'>
-              AI Development <span className='text-modern-purple'>Tools</span>
+              AI Development <span className='text-modern-blue'>Tools</span>
             </h1>
             <p className='mx-auto mt-6 max-w-2xl text-lg text-gray-600'>
               Discover powerful AI tools and best practices to enhance your
@@ -60,7 +60,7 @@ export default function AI() {
                 <ul className='grid gap-4 text-gray-600 sm:grid-cols-2'>
                   <li className='flex items-start'>
                     <svg
-                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-purple'
+                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-blue'
                       fill='none'
                       viewBox='0 0 24 24'
                       stroke='currentColor'
@@ -76,7 +76,7 @@ export default function AI() {
                   </li>
                   <li className='flex items-start'>
                     <svg
-                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-purple'
+                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-blue'
                       fill='none'
                       viewBox='0 0 24 24'
                       stroke='currentColor'
@@ -92,7 +92,7 @@ export default function AI() {
                   </li>
                   <li className='flex items-start'>
                     <svg
-                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-purple'
+                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-blue'
                       fill='none'
                       viewBox='0 0 24 24'
                       stroke='currentColor'
diff --git a/pages/help/faq.tsx b/pages/help/faq.tsx
index 1b0a5fda..908e656a 100644
--- a/pages/help/faq.tsx
+++ b/pages/help/faq.tsx
@@ -125,7 +125,7 @@ const FAQAccordion = ({
       >
         <h3 className='text-xl font-semibold text-gray-900'>{faq.question}</h3>
         <svg
-          className={`h-6 w-6 text-modern-purple transition-transform duration-200 ${
+          className={`h-6 w-6 text-modern-blue transition-transform duration-200 ${
             isOpen ? 'rotate-180' : ''
           }`}
           fill='none'
@@ -183,7 +183,7 @@ export default function FAQ() {
           <div className='text-center'>
             <h1 className='text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl'>
               Frequently Asked{' '}
-              <span className='text-modern-purple'>Questions</span>
+              <span className='text-modern-blue'>Questions</span>
             </h1>
             <p className='mx-auto mt-6 max-w-2xl text-lg text-gray-600'>
               Find answers to common questions about open source contribution
@@ -197,7 +197,7 @@ export default function FAQ() {
               onClick={() => setActiveCategory('All')}
               className={`rounded-full px-6 py-2 text-sm font-medium transition-all duration-200 ${
                 activeCategory === 'All'
-                  ? 'bg-modern-purple text-white'
+                  ? 'bg-modern-blue text-white'
                   : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
               }`}
             >
diff --git a/pages/index.tsx b/pages/index.tsx
index 05d48d03..b667b83f 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -88,7 +88,7 @@ export default function Home() {
           >
             <div className='modern-container'>
               <div className='mx-auto max-w-2xl lg:text-center'>
-                <h2 className='text-3xl font-semibold leading-snug text-modern-purple'>
+                <h2 className='text-3xl font-semibold leading-snug text-modern-blue'>
                   Become a part of our community of over 900 developers who have already contributed to this project!
                 </h2>
                 <p className='mt-6 text-lg leading-8 text-gray-600'>
@@ -158,7 +158,7 @@ export default function Home() {
             <div className='mt-8 text-center'>
               <Link
                 href='/community/contributors'
-                className='inline-flex items-center justify-center rounded-md bg-modern-purple px-6 py-3 text-base font-medium text-white shadow-sm transition-colors duration-200 hover:bg-modern-purple/90'
+                className='inline-flex items-center justify-center rounded-md bg-modern-blue px-6 py-3 text-base font-medium text-white shadow-sm transition-colors duration-200 hover:bg-modern-blue'
               >
                 View All Contributors
                 <svg
diff --git a/pages/legal/privacy-policy.tsx b/pages/legal/privacy-policy.tsx
index 080cddac..99fd9c0e 100644
--- a/pages/legal/privacy-policy.tsx
+++ b/pages/legal/privacy-policy.tsx
@@ -26,7 +26,7 @@ const PrivacyPolicy: React.FC = () => {
             className='text-center'
           >
             <h1 className='text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl'>
-              Privacy <span className='text-modern-purple'>Policy</span>
+              Privacy <span className='text-modern-blue'>Policy</span>
             </h1>
             <p className='mx-auto mt-6 max-w-2xl text-lg text-gray-600'>
               Learn about how we handle your data and protect your privacy.
diff --git a/pages/resources/resources.tsx b/pages/resources/resources.tsx
index ef1f2b13..b4af3e9e 100644
--- a/pages/resources/resources.tsx
+++ b/pages/resources/resources.tsx
@@ -35,7 +35,7 @@ export default function Resources() {
             className='text-center'
           >
             <h1 className='text-fc-primary text-4xl font-bold tracking-tight sm:text-5xl'>
-              Learning <span className='text-modern-purple'>Resources</span>
+              Learning <span className='text-modern-blue'>Resources</span>
             </h1>
             <p className='text-fc-primary/80 mx-auto mt-6 max-w-2xl text-lg'>
               Comprehensive collection of tools, platforms, and materials to
diff --git a/pages/tools/ide.tsx b/pages/tools/ide.tsx
index c641b6b8..c7878f07 100644
--- a/pages/tools/ide.tsx
+++ b/pages/tools/ide.tsx
@@ -29,7 +29,7 @@ export default function IDE() {
           >
             <h1 className='text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl'>
               Integrated Development{' '}
-              <span className='text-modern-purple'>Environments</span>
+              <span className='text-modern-blue'>Environments</span>
             </h1>
             <p className='mx-auto mt-6 max-w-2xl text-lg text-gray-600'>
               Discover powerful IDEs and development tools to enhance your
@@ -71,7 +71,7 @@ export default function IDE() {
                 <ul className='grid gap-4 text-gray-600 sm:grid-cols-2'>
                   <li className='flex items-start'>
                     <svg
-                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-purple'
+                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-blue'
                       fill='none'
                       viewBox='0 0 24 24'
                       stroke='currentColor'
@@ -89,7 +89,7 @@ export default function IDE() {
                   </li>
                   <li className='flex items-start'>
                     <svg
-                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-purple'
+                      className='mr-2 h-6 w-6 flex-shrink-0 text-modern-blue'
                       fill='none'
                       viewBox='0 0 24 24'
                       stroke='currentColor'
diff --git a/styles/tailwind.css b/styles/tailwind.css
index 50c4d21a..4d7023b3 100644
--- a/styles/tailwind.css
+++ b/styles/tailwind.css
@@ -7,7 +7,7 @@
   --bg-primary: #ffffff;
   --bg-secondary: #f8f9fa;
   --bg-hover: #f1f3f5;
-  --accent-color: #844fba;
+  --accent-color: #4A90E2;
 }
 
 /* Theme definitions */
@@ -16,15 +16,15 @@
   --bg-primary: #ffffff;
   --bg-secondary: #f8f9fa;
   --bg-hover: #f1f3f5;
-  --accent-color: #844fba;
+  --accent-color: #4A90E2;
 }
 
 .theme-dark {
-  --fc-primary: #ffffff;
-  --bg-primary: #2d2d3d;
-  --bg-secondary: #363646;
-  --bg-hover: #44445c;
-  --accent-color: #844fba;
+  --fc-primary: #E6EDF7;
+  --bg-primary: rgba(15, 31, 58, 0.71);
+  --bg-secondary: #1A3155;
+  --bg-hover: #22385F;
+  --accent-color: #4A90E2;
 }
 
 /* Modern modern-inspired styles */
@@ -38,20 +38,21 @@
 }
 
 .modern-button {
-  @apply inline-flex items-center rounded-md border border-transparent bg-modern-purple px-4 py-2 text-sm font-medium text-white transition-colors duration-200 hover:bg-modern-darkPurple focus:outline-none focus:ring-2 focus:ring-modern-purple focus:ring-offset-2;
+  @apply inline-flex items-center rounded-md border border-transparent bg-modern-blue px-4 py-2 text-sm font-medium text-white transition-colors duration-200 hover:bg-modern-lightBlue focus:outline-none focus:ring-2 focus:ring-modern-blue focus:ring-offset-2;
 }
 
 .hero-button {
-  @apply inline-flex items-center rounded-md border border-transparent bg-modern-purple px-6 py-3 text-2xl font-medium text-white transition-colors duration-200 hover:bg-modern-darkPurple focus:outline-none focus:ring-2 focus:ring-modern-purple focus:ring-offset-2;
+  @apply inline-flex items-center rounded-md border border-transparent bg-modern-blue px-6 py-3 text-2xl font-medium text-white transition-colors duration-200 hover:bg-modern-lightBlue focus:outline-none focus:ring-2 focus:ring-modern-blue focus:ring-offset-2;
 }
 
+/* Outline кнопки */
 .modern-button-outline {
-  @apply inline-flex items-center rounded-md border border-modern-purple px-4 py-2 text-sm font-medium text-modern-purple transition-colors duration-200 hover:bg-modern-purple hover:text-white focus:outline-none focus:ring-2 focus:ring-modern-purple focus:ring-offset-2;
+  @apply inline-flex items-center rounded-md border border-modern-blue px-4 py-2 text-sm font-medium text-modern-blue transition-colors duration-200 hover:bg-modern-lightBlue hover:text-white focus:outline-none focus:ring-2 focus:ring-modern-blue focus:ring-offset-2;
   background-color: var(--bg-primary);
 }
 
 .hero-button-outline {
-  @apply inline-flex items-center rounded-md border border-modern-purple px-6 py-3 text-2xl font-medium text-modern-purple transition-colors duration-200 hover:bg-modern-purple hover:text-white focus:outline-none focus:ring-2 focus:ring-modern-purple focus:ring-offset-2;
+  @apply inline-flex items-center rounded-md border border-modern-blue px-6 py-3 text-2xl font-medium text-modern-blue transition-colors duration-200 hover:bg-modern-lightBlue hover:text-white focus:outline-none focus:ring-2 focus:ring-modern-blue focus:ring-offset-2;
   background-color: var(--bg-primary);
 }
 
@@ -144,23 +145,23 @@ body {
 
 /* Theme-specific styles */
 .theme-dark .bg-white {
-  @apply bg-gray-800;
+  @apply bg-[#1A3155];
 }
 
 .theme-dark .bg-gray-50 {
-  @apply bg-gray-900;
+  @apply bg-[#0F1F3A];
 }
 
 .theme-dark .text-gray-900 {
-  @apply text-white;
+  @apply text-[#E6EDF7];
 }
 
 .theme-dark .text-gray-600 {
-  @apply text-gray-300;
+  @apply text-[#A3B5D3];
 }
 
 .theme-dark .text-gray-500 {
-  @apply text-gray-400;
+  @apply text-[#7F95B5];
 }
 
 .theme-dark .shadow-sm {
@@ -188,17 +189,17 @@ body {
 }
 
 .theme-dark .hover\:bg-gray-50:hover {
-  @apply hover:bg-gray-800;
+  @apply hover:bg-slate-800;
 }
 
 .theme-dark .hover\:bg-gray-100:hover {
-  @apply hover:bg-gray-700;
+  @apply hover:bg-slate-700;
 }
 
 .theme-dark .hover\:text-gray-900:hover {
-  @apply hover:text-white;
+  @apply hover:text-slate-100;
 }
 
 .theme-dark .hover\:text-gray-700:hover {
-  @apply hover:text-gray-200;
-}
+  @apply hover:text-slate-200;
+}
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index eb7eca14..fa47059b 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -22,13 +22,13 @@ module.exports = {
       },
       colors: {
         modern: {
-          purple: '#844FBA',
-          darkPurple: '#27005D',
+          blue: 'rgba(2,104,225,0.88)',
+          darkBlue: '#0F1F3A',
           navy: '#000C2D',
-          lightNavy: '#101935',
+          lightBlue: '#6793E6',
           white: '#FFFFFF',
-          gray: '#F0F0F0',
-          lightGray: '#F5F5F5',
+          gray: '#F0F4F8',
+          lightGray: '#F8FAFC',
           black: '#000000'
         },
         themes: {