diff --git a/dashboard/15-final/app/page.tsx b/dashboard/15-final/app/page.tsx
index 5d09e10..b8218e1 100644
--- a/dashboard/15-final/app/page.tsx
+++ b/dashboard/15-final/app/page.tsx
@@ -6,7 +6,7 @@ import { ArrowRightIcon } from '@heroicons/react/24/outline';
 export default function Page() {
   return (
     <main className="flex min-h-screen flex-col p-6">
-      <div className="flex h-20 shrink-0 items-end rounded-lg bg-blue-600 p-4 md:h-52">
+      <div className="flex h-20 shrink-0 items-end rounded-lg bg-blue-500 p-4 md:h-52">
         <div className="w-32 text-white md:w-48">
           <AcmeLogo />
         </div>
@@ -24,7 +24,7 @@ export default function Page() {
           </p>
           <Link
             href="/login"
-            className="flex items-center gap-5 self-start rounded-lg bg-blue-600 px-6 py-3 text-sm text-white md:text-base"
+            className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm text-white transition-colors hover:bg-blue-400 md:text-base"
           >
             <span>Log in</span> <ArrowRightIcon className="w-5 md:w-6" />
           </Link>
diff --git a/dashboard/15-final/app/ui/button.tsx b/dashboard/15-final/app/ui/button.tsx
index 545f1cc..c634ac1 100644
--- a/dashboard/15-final/app/ui/button.tsx
+++ b/dashboard/15-final/app/ui/button.tsx
@@ -9,7 +9,7 @@ export function Button({ children, className, ...rest }: ButtonProps) {
     <button
       {...rest}
       className={clsx(
-        'flex h-12 items-center rounded-lg bg-blue-600 px-4 text-sm font-medium text-gray-50 transition-colors hover:bg-blue-500',
+        'flex h-12 items-center rounded-lg bg-blue-500 px-4 text-sm font-medium text-gray-50 transition-colors hover:bg-blue-400',
         className,
       )}
     >
diff --git a/dashboard/15-final/app/ui/dashboard/nav-links.tsx b/dashboard/15-final/app/ui/dashboard/nav-links.tsx
index 88c3530..818b3e5 100644
--- a/dashboard/15-final/app/ui/dashboard/nav-links.tsx
+++ b/dashboard/15-final/app/ui/dashboard/nav-links.tsx
@@ -29,7 +29,7 @@ export default function NavLinks() {
             key={link.name}
             href={link.href}
             className={clsx(
-              ' flex grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2',
+              'flex grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2',
               {
                 'bg-sky-100 text-blue-600': pathname === link.href,
               },
diff --git a/dashboard/15-final/app/ui/dashboard/sidenav.tsx b/dashboard/15-final/app/ui/dashboard/sidenav.tsx
index 8fa45eb..d264a85 100644
--- a/dashboard/15-final/app/ui/dashboard/sidenav.tsx
+++ b/dashboard/15-final/app/ui/dashboard/sidenav.tsx
@@ -7,7 +7,7 @@ export default function SideNav() {
   return (
     <div className="flex h-full flex-col border-r px-2 py-4">
       <Link
-        className="mb-2 flex h-20 items-end justify-center rounded-md bg-blue-600 p-4 md:h-40 md:justify-start"
+        className="mb-2 flex h-20 items-end justify-center rounded-md bg-blue-500 p-4 md:h-40 md:justify-start"
         href="/"
       >
         <div className="w-32 text-white md:w-40">
diff --git a/dashboard/15-final/app/ui/invoices/buttons.tsx b/dashboard/15-final/app/ui/invoices/buttons.tsx
index 9dec8b7..b2800cc 100644
--- a/dashboard/15-final/app/ui/invoices/buttons.tsx
+++ b/dashboard/15-final/app/ui/invoices/buttons.tsx
@@ -6,7 +6,7 @@ export function CreateInvoice() {
   return (
     <Link
       href="/dashboard/invoices/create"
-      className="block rounded-md bg-blue-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
+      className="block rounded-md bg-blue-500 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500"
     >
       Create Invoice
     </Link>
diff --git a/dashboard/15-final/app/ui/invoices/pagination.tsx b/dashboard/15-final/app/ui/invoices/pagination.tsx
index ead1406..30ca93a 100644
--- a/dashboard/15-final/app/ui/invoices/pagination.tsx
+++ b/dashboard/15-final/app/ui/invoices/pagination.tsx
@@ -47,7 +47,7 @@ export default function Pagination({
             className={clsx(
               'flex h-9 w-9 items-center justify-center text-sm ring-1 ring-inset ring-gray-300',
               {
-                'z-10 bg-blue-600 text-white ring-blue-600':
+                'z-10 bg-blue-500 text-white ring-blue-500':
                   currentPage === page,
               },
             )}
diff --git a/dashboard/15-final/app/ui/login-form.tsx b/dashboard/15-final/app/ui/login-form.tsx
index b903a05..2a8c3c6 100644
--- a/dashboard/15-final/app/ui/login-form.tsx
+++ b/dashboard/15-final/app/ui/login-form.tsx
@@ -39,7 +39,7 @@ export default function LoginForm() {
   return (
     <div className="flex items-center justify-center md:h-screen">
       <div className="relative mx-auto flex w-full max-w-[400px] flex-col space-y-2.5 p-4 md:-mt-32">
-        <div className="flex h-36 w-full items-end rounded-lg bg-blue-600 p-3">
+        <div className="flex h-36 w-full items-end rounded-lg bg-blue-500 p-3">
           <Logo />
         </div>
         <form onSubmit={handleSubmit} className="space-y-3">
diff --git a/dashboard/15-final/tailwind.config.ts b/dashboard/15-final/tailwind.config.ts
index 23e3b47..329dd9c 100644
--- a/dashboard/15-final/tailwind.config.ts
+++ b/dashboard/15-final/tailwind.config.ts
@@ -13,6 +13,8 @@ const config: Config = {
       },
       colors: {
         blue: {
+          400: '#2589FE',
+          500: '#0070F3',
           600: '#2F6FEB',
         },
       },