diff --git a/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
index 2cb2bed2..2d606bc9 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
@@ -16,8 +16,7 @@ export function GeneralSettings(props: {
   let fileInputRef = useRef<HTMLInputElement>(null);
 
   return (
-    <DashboardContainer>
-      <h3 className="font-bold text-primary">General Settings</h3>
+    <DashboardContainer section="General Settings">
 
       <div className="flex flex-col gap-2 pb-2">
         <p className=" text-secondary  font-bold">
diff --git a/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
index 360626e1..23ecf50a 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
@@ -17,8 +17,7 @@ export function PostSettings(props: {
   let cardBorderHidden = useCardBorderHidden();
   return (
     <>
-      <DashboardContainer>
-        <h3>Discovery</h3>
+      <DashboardContainer section="Discovery">
         <Toggle
           toggle={props.showInDiscover}
           onToggle={() => props.setShowInDiscover(!props.showInDiscover)}
@@ -35,10 +34,8 @@ export function PostSettings(props: {
           </div>
         </Toggle>
       </DashboardContainer>
-      {cardBorderHidden && <hr className="border-border-light my-2" />}
 
-      <DashboardContainer>
-        <h3>Post Layout</h3>
+      <DashboardContainer section="Post Layout">
         <Toggle
           toggle={props.showPrevNext}
           onToggle={() => props.setShowPrevNext(!props.showPrevNext)}
@@ -48,9 +45,8 @@ export function PostSettings(props: {
           </div>
         </Toggle>
       </DashboardContainer>
-      {cardBorderHidden && <hr className="border-border-light my-2" />}
-      <DashboardContainer>
-        <h3>Post Interactions</h3>
+
+      <DashboardContainer section="Post Interactions">
         <div className="flex flex-col gap-2">
           <Toggle
             toggle={props.showComments}
diff --git a/app/lish/[did]/[publication]/dashboard/settings/PubDomainSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/PubDomainSettings.tsx
index 96939aaf..46e1ff3f 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/PubDomainSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/PubDomainSettings.tsx
@@ -43,7 +43,6 @@ export const PubDomainSettings = () => {
 
   return (
     <>
-      <h3 className="font-bold text-primary">Domains</h3>
       <div className="flex flex-col gap-1">
         <h4>This Publication&apos;s Domains</h4>
         <div className="text-xs text-tertiary -mb-1">DEFAULT</div>
diff --git a/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx b/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
index b5b7bbc8..b78ba15b 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useState, useEffect, useMemo } from "react";
-import { ButtonSecondary } from "components/Buttons";
+import { ButtonPrimary, ButtonSecondary } from "components/Buttons";
 import { DotLoader } from "components/utils/DotLoader";
 import { useToaster } from "components/Toast";
 import { mutate } from "swr";
@@ -18,6 +18,8 @@ import { useCardBorderHidden } from "components/Pages/useCardBorderHidden";
 import { ManageProSubscription } from "./ManageProSubscription";
 import { useIsPro, useCanSeePro } from "src/hooks/useEntitlement";
 import { InlineUpgradeToPro, UpgradeToProButton } from "../../UpgradeModal";
+import { Modal } from "components/Modal";
+import { Input } from "components/Input";
 
 type SettingsView = "all" | "theme";
 
@@ -163,13 +165,10 @@ export function SettingsContent(props: { showPageBackground: boolean }) {
           setIconFile={setIconFile}
         />
 
-        {cardBorderHidden && <hr className="border-border-light my-2" />}
-        <DashboardContainer>
+        <DashboardContainer section="Theme and Layout">
           <ThemeSettings />
         </DashboardContainer>
 
-        {cardBorderHidden && <hr className="border-border-light my-2" />}
-
         {/* ── Post Settings ── */}
         <PostSettings
           showComments={showComments}
@@ -184,22 +183,27 @@ export function SettingsContent(props: { showPageBackground: boolean }) {
           setShowInDiscover={setShowInDiscover}
         />
 
-        {cardBorderHidden && <hr className="border-border-light my-2" />}
-
-        <DashboardContainer>
-          <PubDomainSettings />
+        <DashboardContainer section="Domains">
+          <div className="text-secondary">
+            <PubDomainSettings />
+          </div>
         </DashboardContainer>
-        {cardBorderHidden && <hr className="border-border-light my-2" />}
 
-        <DashboardContainer className="bg-[rgb(var(--accent-light))]">
-          <h3>Leaflet Pro</h3>
+        <DashboardContainer section="Leaflet Pro" className="pb-4">
           {canSeePro && !isPro ? (
             <UpgradeToProButton />
           ) : (
             <ManageProSubscription compact />
           )}
         </DashboardContainer>
-        {cardBorderHidden && <div className="spacer h-4" />}
+        <div className="flex flex-col gap-1">
+          <hr className="border-border border-2" />
+          <hr className="border-border border-2" />
+        </div>
+
+        <DashboardContainer section="DANGER!" className="pb-4">
+          <DeletePublication />
+        </DashboardContainer>
 
         {hasUnsavedChanges && <SettingsFooter loading={loading} />}
       </div>
@@ -254,13 +258,66 @@ function SettingsFooter(props: { loading: boolean }) {
 export const DashboardContainer = (props: {
   children: React.ReactNode;
   className?: string;
+  section?: string;
 }) => {
   let cardBorderHidden = useCardBorderHidden();
   return (
     <div
-      className={`flex flex-col rounded-lg! gap-2 ${!cardBorderHidden ? "container p-3 sm:px-4" : "bg-transparent"}`}
+      className={`container flex flex-col rounded-lg! gap-2 p-3 sm:px-4 ${!cardBorderHidden ? "" : "bg-trasparent!"} ${props.className}`}
     >
+      {props.section && (
+        <>
+          <h3 className="font-bold text-primary">{props.section}</h3>
+          <hr className="-mt-1 mb-2 border-border-light" />
+        </>
+      )}
       {props.children}
     </div>
   );
 };
+
+const DeletePublication = () => {
+  let [value, setValue] = useState("");
+  let record = useNormalizedPublicationRecord();
+  let { data: pub } = usePublicationData();
+  let postCount = pub?.documents?.length;
+  let subCount = pub?.publication?.publication_subscriptions?.length;
+  return (
+    <Modal
+      asChild
+      className="text-center"
+      trigger={<ButtonPrimary>Delete Publication</ButtonPrimary>}
+      title="Are you sure?"
+    >
+      <div className="text-secondary flex flex-col">
+        <div className="pb-2">
+          You will permanently lose <br />
+          {postCount !== 0
+            ? `${pub?.documents?.length} post${postCount !== 1 && "s"}`
+            : null}
+          <br />
+          {subCount !== 0
+            ? `${pub?.documents?.length} subscriber${subCount !== 1 && "s"}`
+            : null}
+        </div>
+        <div className="font-bold pb-1">
+          Enter the name of this publication to confirm
+        </div>
+
+        <Input
+          className="input-with-border w-full mb-3 text-primary max-w-prose"
+          placeholder={record?.name ? record.name : "Publication Name"}
+          type={`text`}
+          value={value}
+          onChange={(e) => setValue(e.currentTarget.value)}
+        />
+        <ButtonPrimary
+          className="mx-auto mb-1"
+          disabled={record?.name !== value}
+        >
+          Delete Publication
+        </ButtonPrimary>
+      </div>
+    </Modal>
+  );
+};
diff --git a/app/lish/[did]/[publication]/dashboard/settings/ThemeSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/ThemeSettings.tsx
index d0d0575e..37e90d52 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/ThemeSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/ThemeSettings.tsx
@@ -10,7 +10,6 @@ export function ThemeSettings() {
 
   return (
     <>
-      <h3 className="font-bold text-primary">Theme and Layout</h3>
       <SpeedyLink
         className="text-left flex gap-2 items-center text-accent-contrast font-bold no-underline! w-fit"
         href={href}