diff --git a/README.md b/README.md
index 97671c9..cb23c51 100644
--- a/README.md
+++ b/README.md
@@ -30,17 +30,13 @@ The Control Panel keeps you informed with real-time alers for all instance opera
 
 Choose the instance type and storage size that best fits your workload. Whether you’re testing a small service or running production traffic, Rabbitory gives you the flexibility to scale on your terms.
 
----
-
 ## 📦 Prerequisites
 
 Before gaining access to the Rabbitory Control Panel, use the Rabbitory CLI to deploy your AWS infrastructure. Please visit the [Rabbitory CLI github repository](https://github.com/Rabbitory/rabbitory_cli) for information and instructions.
 
----
-
 ## 🐰 Usage
 
-The Rabbitory Control Panel is the central hub for managing every part of your RabbitMQ instance — from creation to configuration to monitoring.
+The Rabbitory Control Panel is the central hub for managing every part of your RabbitMQ instance — from creation to configuration to monitoring. Rabbitory users receive a URL to their Control Panle after deploying their infrastructure with the custom cli tool. This Control Panel provides the following important features:
 
 ### Create a RabbitMQ Instance
 
@@ -118,6 +114,10 @@ For real-time insight, the Logs Page streams live logs straight from your server
 
 The Alarms Page keeps your team informed by providing notifications in your Slack workspace about critical CPU and disk usage metrics, helping you stay ahead of potential issues.
 
+<p>
+<img src="https://raw.githubusercontent.com/Rabbitory/rabbitory_control_panel/main/assets/alarms-page.png" alt="Alarms Page"/>
+</p>
+
 ---
 
 The Rabbitory Control Panel provides a powerful, intuitive interface for managing RabbitMQ instances on AWS. With features like one-click provisioning, real-time notifications, easy plugin management, and comprehensive firewall controls, it streamlines the complexities of RabbitMQ management. Whether you're monitoring performance, configuring instances, or setting alarms, Rabbitory offers full visibility and control—all from a clean, browser-based dashboard.
diff --git a/assets/alarms-page.png b/assets/alarms-page.png
new file mode 100644
index 0000000..18f9e3d
Binary files /dev/null and b/assets/alarms-page.png differ
diff --git a/src/app/instances/[name]/alarms/components/Dropdown.tsx b/src/app/instances/[name]/alarms/components/Dropdown.tsx
index 86d6ef8..5e084b9 100644
--- a/src/app/instances/[name]/alarms/components/Dropdown.tsx
+++ b/src/app/instances/[name]/alarms/components/Dropdown.tsx
@@ -16,14 +16,14 @@ interface DropdownOptionsProps {
 
 const DropdownOptions = ({ options, onOptionClick }: DropdownOptionsProps) => {
   return (
-    <ul className="absolute mt-1 min-w-[150px] bg-white border border-gray-300 rounded-lg shadow-lg left-0 z-50">
+    <ul className="font-heading1 text-headertext1 absolute mt-1 min-w-[150px] bg-card border border-pagetext1 rounded-sm left-0 z-50">
       {Object.keys(options).map((opt, idx) => (
         <li
           key={opt + idx}
           onClick={() => {
             onOptionClick(options[opt]);
           }}
-          className="px-4 py-2 hover:bg-gray-100 hover:border-gray-300 cursor-pointer border-b border-gray-300 last:border-none"
+          className="px-4 py-2 hover:text-btnhover1 cursor-pointer border-b border-pagetext1 last:border-none"
         >
           {opt}
         </li>
@@ -58,7 +58,8 @@ export default function Dropdown({ label, options }: DropdownProps) {
 
   return (
     <div className="relative inline-block" ref={dropdownRef}>
-      <button className="px-4 bg-gray-200 rounded-lg z-40" onClick={handleClick}>
+      <button className="font-heading1 px-4 bg-card text-btn1 border border-btn1 rounded-sm text-center hover:shadow-[0_0_8px_#87d9da] transition-all duration-200 hover:bg-card z-40" 
+      onClick={handleClick}>
         {label}
       </button>
       {isOpen && <DropdownOptions options={options} onOptionClick={handleOptionClick} />}