diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx
index 4d8b1b6..0a709c6 100644
--- a/src/components/navbar.tsx
+++ b/src/components/navbar.tsx
@@ -68,7 +68,7 @@ export const NavBar = (props: { params: Params }) => {
             <span
               classList={{
                 "iconify shrink-0 transition-colors duration-200": true,
-                "lucide--alert-triangle text-red-500 dark:text-red-400":
+                "lucide--unplug text-red-500 dark:text-red-400":
                   pds() === "Missing PDS" && props.params.repo?.startsWith("did:"),
                 "lucide--hard-drive text-neutral-500 group-hover:text-neutral-700 dark:text-neutral-400 dark:group-hover:text-neutral-200":
                   pds() !== "Missing PDS" || !props.params.repo?.startsWith("did:"),
diff --git a/src/views/pds.tsx b/src/views/pds.tsx
index efac7e6..aebedd9 100644
--- a/src/views/pds.tsx
+++ b/src/views/pds.tsx
@@ -79,7 +79,13 @@ export const PdsView = () => {
               </span>
               <Show when={!repo.active}>
                 <span class="flex shrink-0 items-center gap-1 text-red-500 dark:text-red-400">
-                  <span class="iconify lucide--unplug"></span>
+                  <span
+                    class={`iconify ${
+                      repo.status === "deactivated" ? "lucide--user-round-x"
+                      : repo.status === "takendown" ? "lucide--shield-ban"
+                      : "lucide--unplug"
+                    }`}
+                  ></span>
                   {repo.status ?? "inactive"}
                 </span>
               </Show>
@@ -145,7 +151,7 @@ export const PdsView = () => {
               <For each={repos()}>{(repo) => <RepoCard {...repo} />}</For>
             </div>
           </Show>
-          <div class="flex flex-col gap-2">
+          <div class="flex flex-col gap-3">
             <Show when={location.hash === "#info"}>
               <Show when={version()}>
                 {(version) => (
@@ -160,7 +166,9 @@ export const PdsView = () => {
                   <>
                     <div class="flex flex-col">
                       <span class="font-semibold">DID</span>
-                      <span class="text-sm">{server().did}</span>
+                      <span class="text-sm text-neutral-700 dark:text-neutral-300">
+                        {server().did}
+                      </span>
                     </div>
                     <div class="flex items-center gap-1">
                       <span class="font-semibold">Invite Code Required</span>
@@ -183,7 +191,11 @@ export const PdsView = () => {
                       <div class="flex flex-col">
                         <span class="font-semibold">Available User Domains</span>
                         <For each={server().availableUserDomains}>
-                          {(domain) => <span class="text-sm wrap-anywhere">{domain}</span>}
+                          {(domain) => (
+                            <span class="text-sm wrap-anywhere text-neutral-700 dark:text-neutral-300">
+                              {domain}
+                            </span>
+                          )}
                         </For>
                       </div>
                     </Show>
@@ -192,7 +204,7 @@ export const PdsView = () => {
                         <span class="font-semibold">Privacy Policy</span>
                         <a
                           href={server().links?.privacyPolicy}
-                          class="text-sm hover:underline"
+                          class="text-sm text-neutral-700 hover:underline dark:text-neutral-300"
                           target="_blank"
                           rel="noopener"
                         >
@@ -205,7 +217,7 @@ export const PdsView = () => {
                         <span class="font-semibold">Terms of Service</span>
                         <a
                           href={server().links?.termsOfService}
-                          class="text-sm hover:underline"
+                          class="text-sm text-neutral-700 hover:underline dark:text-neutral-300"
                           target="_blank"
                           rel="noopener"
                         >
@@ -218,7 +230,7 @@ export const PdsView = () => {
                         <span class="font-semibold">Contact</span>
                         <a
                           href={`mailto:${server().contact?.email}`}
-                          class="text-sm hover:underline"
+                          class="text-sm text-neutral-700 hover:underline dark:text-neutral-300"
                         >
                           {server().contact?.email}
                         </a>
diff --git a/src/views/record.tsx b/src/views/record.tsx
index 17a9ef7..ac3f8e3 100644
--- a/src/views/record.tsx
+++ b/src/views/record.tsx
@@ -509,15 +509,20 @@ export const RecordView = () => {
               </ErrorBoundary>
             </Show>
             <Show when={location.hash === "#info"}>
-              <div class="flex w-full flex-col gap-2 px-2 text-sm">
+              <div class="flex w-full flex-col gap-3 px-2">
                 <div>
                   <p class="font-semibold">AT URI</p>
-                  <div class="truncate text-xs">{record()?.uri}</div>
+                  <div class="truncate text-xs text-neutral-700 dark:text-neutral-300">
+                    {record()?.uri}
+                  </div>
                 </div>
                 <Show when={record()?.cid}>
                   <div>
                     <p class="font-semibold">CID</p>
-                    <div class="truncate text-left text-xs" dir="rtl">
+                    <div
+                      class="truncate text-left text-xs text-neutral-700 dark:text-neutral-300"
+                      dir="rtl"
+                    >
                       {record()?.cid}
                     </div>
                   </div>
diff --git a/src/views/repo.tsx b/src/views/repo.tsx
index d1bab16..cce29bf 100644
--- a/src/views/repo.tsx
+++ b/src/views/repo.tsx
@@ -325,8 +325,14 @@ export const RepoView = () => {
             </div>
             <div class="flex gap-1">
               <Show when={error() && error() !== "Missing PDS"}>
-                <div class="flex items-center gap-1 font-medium text-red-500 dark:text-red-400">
-                  <span class="iconify lucide--alert-triangle"></span>
+                <div class="flex items-center gap-1.5 rounded-md border border-red-500 px-2 py-0.5 text-xs font-medium text-red-500 sm:text-sm dark:border-red-400 dark:text-red-400">
+                  <span
+                    class={`iconify ${
+                      error() === "Deactivated" ? "lucide--user-round-x"
+                      : error() === "Takendown" ? "lucide--shield-ban"
+                      : "lucide--unplug"
+                    }`}
+                  ></span>
                   <span>{error()}</span>
                 </div>
               </Show>