diff --git a/frontend/config/tailwind/plugins/attributes.js b/frontend/config/tailwind/plugins/attributes.js
new file mode 100644
index 00000000..8d5444c0
--- /dev/null
+++ b/frontend/config/tailwind/plugins/attributes.js
@@ -0,0 +1,4 @@
+const plugin = require("tailwindcss/plugin");
+module.exports = plugin(function ({ matchVariant }) {
+  matchVariant("attr", (value) => `&[${value}]`);
+});
diff --git a/frontend/config/tailwind/plugins/parts.js b/frontend/config/tailwind/plugins/parts.js
new file mode 100644
index 00000000..609264fc
--- /dev/null
+++ b/frontend/config/tailwind/plugins/parts.js
@@ -0,0 +1,4 @@
+const plugin = require("tailwindcss/plugin");
+module.exports = plugin(function ({ matchVariant }) {
+  matchVariant("part", (value) => `&::part(${value})`);
+});
diff --git a/frontend/src/components/ui/overflow-dropdown.ts b/frontend/src/components/ui/overflow-dropdown.ts
index cc113f47..ac9f40a6 100644
--- a/frontend/src/components/ui/overflow-dropdown.ts
+++ b/frontend/src/components/ui/overflow-dropdown.ts
@@ -1,6 +1,6 @@
 import { localized, msg } from "@lit/localize";
 import type { SlDropdown, SlMenu } from "@shoelace-style/shoelace";
-import { css, html, LitElement } from "lit";
+import { html } from "lit";
 import {
   customElement,
   query,
@@ -8,6 +8,8 @@ import {
   state,
 } from "lit/decorators.js";
 
+import { TailwindElement } from "@/classes/TailwindElement";
+
 /**
  * Dropdown for additional actions.
  *
@@ -23,19 +25,7 @@ import {
  */
 @localized()
 @customElement("btrix-overflow-dropdown")
-export class OverflowDropdown extends LitElement {
-  static style = [
-    css`
-      .trigger {
-        font-size: 1rem;
-      }
-
-      .trigger[disabled] {
-        visibility: hidden;
-      }
-    `,
-  ];
-
+export class OverflowDropdown extends TailwindElement {
   @state()
   private hasMenuItems?: boolean;
 
@@ -50,7 +40,7 @@ export class OverflowDropdown extends LitElement {
       <sl-dropdown ?disabled=${!this.hasMenuItems} hoist>
         <sl-icon-button
           slot="trigger"
-          class="trigger"
+          class="font-base attr-[disabled]:invisible part-[base]:p-3"
           label=${msg("Actions")}
           name="three-dots-vertical"
           ?disabled=${!this.hasMenuItems}
diff --git a/frontend/src/components/ui/tab-list.ts b/frontend/src/components/ui/tab-list.ts
index 6f32a449..2a16e9cb 100644
--- a/frontend/src/components/ui/tab-list.ts
+++ b/frontend/src/components/ui/tab-list.ts
@@ -83,7 +83,7 @@ export class TabList extends TailwindElement {
       --track-width: 4px;
     }
 
-    .container {
+    .btrix-tab-list-container {
       display: grid;
       grid-template-areas:
         "menu"
@@ -94,7 +94,7 @@ export class TabList extends TailwindElement {
     }
 
     @media only screen and (min-width: ${TWO_COL_SCREEN_MIN_CSS}) {
-      .container {
+      .btrix-tab-list-container {
         grid-template-areas:
           ". header"
           "menu main";
@@ -227,7 +227,7 @@ export class TabList extends TailwindElement {
 
   render() {
     return html`
-      <div class="container">
+      <div class="btrix-tab-list-container">
         <div class="navWrapper min-w-0">${this.renderNav()}</div>
         <div class="header"><slot name="header"></slot></div>
         <div class="content">
diff --git a/frontend/src/pages/org/archived-item-detail/ui/qa.ts b/frontend/src/pages/org/archived-item-detail/ui/qa.ts
index 5638ae3d..c53bbad0 100644
--- a/frontend/src/pages/org/archived-item-detail/ui/qa.ts
+++ b/frontend/src/pages/org/archived-item-detail/ui/qa.ts
@@ -329,7 +329,7 @@ export class ArchivedItemDetailQA extends TailwindElement {
               <btrix-table-header-cell>
                 ${msg("Started by")}
               </btrix-table-header-cell>
-              <btrix-table-header-cell class="px-1">
+              <btrix-table-header-cell class="px-0">
                 <span class="sr-only">${msg("Row actions")}</span>
               </btrix-table-header-cell>
             </btrix-table-head>
@@ -389,7 +389,7 @@ export class ArchivedItemDetailQA extends TailwindElement {
               : notApplicable()}
           </btrix-table-cell>
           <btrix-table-cell>${run.userName}</btrix-table-cell>
-          <btrix-table-cell class="px-1">
+          <btrix-table-cell class="p-0">
             <div class="col action">
               <btrix-overflow-dropdown
                 @sl-show=${async (e: SlShowEvent) => {
diff --git a/frontend/src/pages/org/archived-items.ts b/frontend/src/pages/org/archived-items.ts
index 28d4436a..33deb652 100644
--- a/frontend/src/pages/org/archived-items.ts
+++ b/frontend/src/pages/org/archived-items.ts
@@ -389,7 +389,7 @@ export class CrawlsList extends TailwindElement {
       ${items.length
         ? html`
             <btrix-archived-item-list .listType=${this.itemType}>
-              <btrix-table-header-cell slot="actionCell" class="px-1">
+              <btrix-table-header-cell slot="actionCell" class="p-0">
                 <span class="sr-only">${msg("Row actions")}</span>
               </btrix-table-header-cell>
               ${repeat(items, ({ id }) => id, this.renderArchivedItem)}
@@ -602,7 +602,7 @@ export class CrawlsList extends TailwindElement {
       .item=${item}
       ?showStatus=${this.itemType !== null}
     >
-      <btrix-table-cell slot="actionCell" class="px-1">
+      <btrix-table-cell slot="actionCell" class="p-0">
         <btrix-overflow-dropdown
           @click=${(e: MouseEvent) => {
             // Prevent navigation to detail view
diff --git a/frontend/src/pages/org/browser-profiles-list.ts b/frontend/src/pages/org/browser-profiles-list.ts
index efd612d3..b5081354 100644
--- a/frontend/src/pages/org/browser-profiles-list.ts
+++ b/frontend/src/pages/org/browser-profiles-list.ts
@@ -327,7 +327,7 @@ export class BrowserProfilesList extends TailwindElement {
             ></sl-format-date>
           </sl-tooltip>
         </btrix-table-cell>
-        <btrix-table-cell class="px-1">
+        <btrix-table-cell class="p-0">
           ${this.renderActions(data)}
         </btrix-table-cell>
       </btrix-table-row>
diff --git a/frontend/src/pages/org/collection-detail.ts b/frontend/src/pages/org/collection-detail.ts
index d0d27d90..80b32df3 100644
--- a/frontend/src/pages/org/collection-detail.ts
+++ b/frontend/src/pages/org/collection-detail.ts
@@ -643,7 +643,7 @@ export class CollectionDetail extends LiteElement {
 
     return html`
       <btrix-archived-item-list>
-        <btrix-table-header-cell slot="actionCell" class="px-1">
+        <btrix-table-header-cell slot="actionCell" class="p-0">
           <span class="sr-only">${msg("Row actions")}</span>
         </btrix-table-header-cell>
         ${repeat(
@@ -677,7 +677,7 @@ export class CollectionDetail extends LiteElement {
     >
       ${this.isCrawler
         ? html`
-            <btrix-table-cell slot="actionCell" class="px-1">
+            <btrix-table-cell slot="actionCell" class="p-0">
               <btrix-overflow-dropdown
                 @click=${(e: MouseEvent) => {
                   // Prevent navigation to detail view
diff --git a/frontend/src/pages/org/collections-list.ts b/frontend/src/pages/org/collections-list.ts
index 4dd8f039..3e776585 100644
--- a/frontend/src/pages/org/collections-list.ts
+++ b/frontend/src/pages/org/collections-list.ts
@@ -553,7 +553,7 @@ export class CollectionsList extends LiteElement {
           minute="2-digit"
         ></sl-format-date>
       </btrix-table-cell>
-      <btrix-table-cell class="px-1">
+      <btrix-table-cell class="p-0">
         ${this.isCrawler ? this.renderActions(col) : ""}
       </btrix-table-cell>
     </btrix-table-row>
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 63f1846d..2a2c5f82 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -1,7 +1,9 @@
 const { tailwindTransform } = require("postcss-lit");
 
+const attributes = require("./config/tailwind/plugins/attributes");
 const containPlugin = require("./config/tailwind/plugins/contain");
 const contentVisibilityPlugin = require("./config/tailwind/plugins/content-visibility");
+const cssPartsPlugin = require("./config/tailwind/plugins/parts");
 
 const PRIMARY_COLOR = "#0891B2";
 
@@ -163,7 +165,9 @@ module.exports = {
 
   plugins: [
     require("@tailwindcss/container-queries"),
+    attributes,
     containPlugin,
     contentVisibilityPlugin,
+    cssPartsPlugin,
   ],
 };