diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css
index e87cf44..5f1aa07 100644
--- a/app/assets/stylesheets/application.tailwind.css
+++ b/app/assets/stylesheets/application.tailwind.css
@@ -4,7 +4,7 @@
 
 @layer components {
   .btn-primary {
-    @apply rounded-lg px-4 bg-purple-800 inline-block font-medium text-white;
+    @apply rounded-lg px-4 bg-primary-purple inline-block font-medium text-white;
   }
 
   .btn-danger {
@@ -46,7 +46,7 @@
     background-color: white;
     display: inline-block;
     padding: 16px;
-    color: rgb(107 33 168);
+    color: #5521B5;
     border-top-left-radius: 0.5rem;
     border-top-right-radius: 0.5rem;
   }
@@ -62,6 +62,11 @@
     color: rgb(75 85 99);
     background-color: rgb(249 250 251);
   }
+
+  input[type="radio"].radio-button:checked {
+    background-color:#5521B5;
+    border:1px solid black;
+  }
 }
 
 
diff --git a/app/views/dashboard/_index.html.erb b/app/views/dashboard/_index.html.erb
index dd6f393..1385eff 100644
--- a/app/views/dashboard/_index.html.erb
+++ b/app/views/dashboard/_index.html.erb
@@ -37,7 +37,7 @@
             <div class="flex flex-row">
               <% FederalTaxTableType.all.each do |table| %>
                 <div class="mx-auto">
-                  <%= form.radio_button :federal_tax_table_type_id, table.id, checked: table.id == @federal_tax_table_type_id, onchange: "this.form.requestSubmit()" %>
+                  <%= form.radio_button :federal_tax_table_type_id, table.id, checked: table.id == @federal_tax_table_type_id, onchange: "this.form.requestSubmit()", class: "radio-button" %>
                   <%= form.label :federal_tax_table_type_id, table.filing_status.humanize.capitalize %>
                 </div>
               <% end %>
diff --git a/app/views/federal_tax_brackets/_federal_tax_bracket.html.erb b/app/views/federal_tax_brackets/_federal_tax_bracket.html.erb
index 404e109..6c00782 100644
--- a/app/views/federal_tax_brackets/_federal_tax_bracket.html.erb
+++ b/app/views/federal_tax_brackets/_federal_tax_bracket.html.erb
@@ -4,6 +4,6 @@
     <% attributes.each do |attribute| %>
       <div class="py-1"><%= attribute %></div>
     <% end %>
-    <div class="py-1"><%= link_to 'Edit', edit_federal_tax_bracket_path(federal_tax_bracket), class: "rounded-lg py-3 ml-2 px-5 bg-gray-100 inline-block font-medium" %></div>
+    <div class="py-1"><%= link_to 'Edit', edit_federal_tax_bracket_path(federal_tax_bracket), class: "btn btn-primary" %></div>
   </div>
 <% end %>
diff --git a/app/views/federal_tax_brackets/_index.html.erb b/app/views/federal_tax_brackets/_index.html.erb
index 7d0fdce..b133a60 100644
--- a/app/views/federal_tax_brackets/_index.html.erb
+++ b/app/views/federal_tax_brackets/_index.html.erb
@@ -5,7 +5,7 @@
         <div class="mx-auto py-6 sm:px-6 lg:px-8">
           <div class="flex flex-row">
             <h1 class="font-bold text-4xl mr-4">Federal Tax Brackets</h1>
-            <%= link_to 'New federal tax bracket', new_federal_tax_bracket_path, class: "rounded-lg py-2 px-5 bg-blue-600 text-white block font-medium" %>
+            <%= link_to 'New federal tax bracket', new_federal_tax_bracket_path, class: "rounded-lg p-2 bg-primary-purple inline-block font-medium text-white" %>
           </div>
         </div>
       </div>
diff --git a/config/tailwind.config.js b/config/tailwind.config.js
index 8fb9931..c598649 100644
--- a/config/tailwind.config.js
+++ b/config/tailwind.config.js
@@ -12,6 +12,9 @@ module.exports = {
       fontFamily: {
         sans: ['Inter var', ...defaultTheme.fontFamily.sans],
       },
+      colors:{
+        'primary-purple': '#5521B5',
+      }
     },
   },
   plugins: [