diff --git a/app/components/DS/pill.html.erb b/app/components/DS/pill.html.erb
index 2dc15e0ec..67e051905 100644
--- a/app/components/DS/pill.html.erb
+++ b/app/components/DS/pill.html.erb
@@ -10,11 +10,15 @@
 <% else %>
   <span class="<%= container_classes %>" style="<%= container_styles %>" title="<%= title || label %>">
     <% if icon %>
-      <%= helpers.icon(icon, size: "xs", color: "current") %>
+      <span class="shrink-0"><%= helpers.icon(icon, size: icon_size, color: "current") %></span>
     <% elsif show_dot %>
       <span class="inline-block shrink-0 rounded-full"
             style="width: <%= dot_size_px %>px; height: <%= dot_size_px %>px; background-color: <%= dot_color %>;"></span>
     <% end %>
-    <%= label %>
+    <% if truncate || label_testid %>
+      <%= tag.span label, class: ("min-w-0 truncate" if truncate), data: (label_testid ? { testid: label_testid } : nil) %>
+    <% else %>
+      <%= label %>
+    <% end %>
   </span>
 <% end %>
diff --git a/app/components/DS/pill.rb b/app/components/DS/pill.rb
index c45bf056c..b9ef102db 100644
--- a/app/components/DS/pill.rb
+++ b/app/components/DS/pill.rb
@@ -16,7 +16,8 @@ class DS::Pill < DesignSystemComponent
     neutral:     :gray
   }.freeze
 
-  attr_reader :label, :tone, :style, :size, :show_dot, :dot_only, :title, :icon, :marker, :custom_color
+  attr_reader :label, :tone, :style, :size, :show_dot, :dot_only, :title, :icon, :marker, :custom_color,
+              :truncate, :label_testid, :icon_size
 
   # Generic inline pill primitive. Two modes:
   #
@@ -50,8 +51,17 @@ class DS::Pill < DesignSystemComponent
   #   `SEMANTIC_TONE_ALIASES`.
   # - Sure has full violet / indigo / fuchsia / amber / green / gray /
   #   red ramps in the design system; this component picks named tokens
-  #   at render time. No raw hex.
-  def initialize(label: nil, tone: :violet, style: :soft, size: :sm, show_dot: nil, dot_only: false, title: nil, icon: nil, marker: true, custom_color: nil)
+  #   at render time. No raw hex — except `custom_color:`, which exists for
+  #   user-defined entities (categories, tags) whose hue is data, not design.
+  # - `truncate: true` lets the pill shrink inside a `min-w-0` parent and
+  #   ellipsize its label instead of overflowing (dense table cells like the
+  #   transaction row's category column). Default pills stay `shrink-0`.
+  # - `label_testid:` stamps `data-testid` on the label span for system /
+  #   controller tests that need to target the text node.
+  # - `icon_size:` passes through to the icon helper (default "xs"; the
+  #   category badge uses "sm" to keep its established glyph size).
+  def initialize(label: nil, tone: :violet, style: :soft, size: :sm, show_dot: nil, dot_only: false, title: nil, icon: nil, marker: true, custom_color: nil,
+                 truncate: false, label_testid: nil, icon_size: "xs")
     resolved_tone = SEMANTIC_TONE_ALIASES.fetch(tone.to_sym, tone.to_sym)
     @label = label || I18n.t("ds.pill.default_label", default: "Beta")
     @tone = TONES.include?(resolved_tone) ? resolved_tone : :violet
@@ -65,6 +75,9 @@ class DS::Pill < DesignSystemComponent
     @icon = icon
     @marker = marker
     @custom_color = custom_color
+    @truncate = truncate
+    @label_testid = label_testid
+    @icon_size = icon_size
   end
 
   def palette
@@ -149,7 +162,10 @@ class DS::Pill < DesignSystemComponent
 
   def container_classes
     base = [
-      "inline-flex items-center align-middle font-medium whitespace-nowrap shrink-0",
+      "inline-flex items-center align-middle font-medium",
+      # Truncating pills must be allowed to shrink (and let the label span
+      # ellipsize); everything else keeps its intrinsic width.
+      truncate ? "max-w-full min-w-0" : "whitespace-nowrap shrink-0",
       "border leading-none"
     ]
 
diff --git a/app/views/categories/_badge.html.erb b/app/views/categories/_badge.html.erb
index 5ab8d6c1d..283c05fc2 100644
--- a/app/views/categories/_badge.html.erb
+++ b/app/views/categories/_badge.html.erb
@@ -1,17 +1,20 @@
 <%# locals: (category:) %>
 <% category ||= Category.uncategorized %>
 
+<%# Canonical category badge: DS::Pill in badge mode carrying the category's
+    user-chosen hex (custom_color is the sanctioned escape hatch for hues that
+    are data, not design). truncate + this min-w-0 wrapper keep long names
+    ellipsizing inside tight columns (e.g. the transaction row's category
+    cell) instead of overflowing them. %>
 <div class="min-w-0">
-  <span class="flex w-full items-center gap-1 text-sm font-medium rounded-full px-1.5 py-1 border focus-visible:outline-none focus-visible:ring-0"
-        style="
-          background-color: color-mix(in oklab, <%= category.color %> 10%, transparent);
-          border-color: color-mix(in oklab, <%= category.color %> 10%, transparent);
-          color: <%= category.color %>;">
-    <% if category.lucide_icon.present? %>
-      <span class="shrink-0">
-        <%= icon category.lucide_icon, size: "sm", color: "current" %>
-      </span>
-    <% end %>
-    <span class="min-w-0 flex-1 truncate" data-testid="category-name"><%= category.name %></span>
-  </span>
+  <%= render DS::Pill.new(
+        label: category.name,
+        custom_color: category.color,
+        icon: category.lucide_icon.presence,
+        icon_size: "sm",
+        marker: false,
+        size: :md,
+        truncate: true,
+        label_testid: "category-name",
+        title: category.name) %>
 </div>
diff --git a/app/views/transactions/_transaction.html.erb b/app/views/transactions/_transaction.html.erb
index 9aff39d03..9752d6117 100644
--- a/app/views/transactions/_transaction.html.erb
+++ b/app/views/transactions/_transaction.html.erb
@@ -7,7 +7,7 @@
   <%= turbo_frame_tag dom_id(transaction) do %>
     <div class="group flex lg:grid lg:grid-cols-12 items-center text-primary text-sm font-medium p-3 lg:p-4 <%= "pl-8 lg:pl-12" if in_split_group %>">
 
-      <div class="pr-4 lg:pr-10 flex items-center gap-3 lg:gap-4 col-span-8 min-w-0">
+      <div class="pr-4 lg:pr-10 flex items-center gap-3 lg:gap-4 col-span-7 min-w-0">
         <%= check_box_tag dom_id(entry, "selection"),
             disabled: transaction.transfer.present?,
             class: "checkbox checkbox--light hidden lg:block",
@@ -179,7 +179,7 @@
         </div>
       </div>
 
-      <div class="hidden md:flex min-w-0 items-center gap-1 col-span-2">
+      <div class="hidden md:flex min-w-0 items-center gap-1 col-span-3">
         <% if entry.account.supports_trades? && !transaction.transfer? %>
           <%# For investment/crypto accounts, show activity label instead of category %>
           <%= render "investment_activity/quick_edit_badge", entry: entry, entryable: transaction %>
diff --git a/test/components/DS/pill_test.rb b/test/components/DS/pill_test.rb
index b66b0a200..5fbc9a542 100644
--- a/test/components/DS/pill_test.rb
+++ b/test/components/DS/pill_test.rb
@@ -90,4 +90,37 @@ class DS::PillTest < ViewComponent::TestCase
     # `inline-block.rounded-full` to avoid matching the parent pill.
     assert_no_selector "span.inline-block.rounded-full"
   end
+
+  test "truncate: true lets the pill shrink and ellipsizes the label" do
+    render_inline(DS::Pill.new(label: "A very long category name", marker: false, truncate: true))
+
+    pill = page.find("span[title='A very long category name']")
+    assert_includes pill[:class], "max-w-full"
+    assert_includes pill[:class], "min-w-0"
+    refute_includes pill[:class], "shrink-0"
+    refute_includes pill[:class], "whitespace-nowrap"
+    assert_selector "span.min-w-0.truncate", text: "A very long category name"
+  end
+
+  test "default pills keep intrinsic width (no truncation chrome)" do
+    render_inline(DS::Pill.new(label: "Active", marker: false))
+
+    pill = page.find("span", text: "Active")
+    assert_includes pill[:class], "shrink-0"
+    assert_includes pill[:class], "whitespace-nowrap"
+    assert_no_selector "span.truncate"
+  end
+
+  test "label_testid stamps data-testid on the label span" do
+    render_inline(DS::Pill.new(label: "Groceries", marker: false, label_testid: "category-name"))
+
+    assert_selector "span[data-testid='category-name']", text: "Groceries"
+  end
+
+  test "icon_size passes through to the icon helper" do
+    render_inline(DS::Pill.new(label: "Food", marker: false, icon: "utensils", icon_size: "sm"))
+
+    # sm maps to w-4 h-4 in the icon helper's size table.
+    assert_selector "svg.w-4.h-4"
+  end
 end
diff --git a/test/components/previews/pill_component_preview.rb b/test/components/previews/pill_component_preview.rb
index fce55a602..135ac209b 100644
--- a/test/components/previews/pill_component_preview.rb
+++ b/test/components/previews/pill_component_preview.rb
@@ -69,4 +69,19 @@ class PillComponentPreview < ViewComponent::Preview
     render DS::Pill.new(label: "Past due", tone: :error, marker: false, size: :md)
   end
   # @!endgroup
+
+  # The categories/_badge recipe: user-chosen hex via custom_color, icon at
+  # "sm", and truncate so the label ellipsizes inside a tight min-w-0 column.
+  # @display container_classes max-w-[140px]
+  def category_badge_truncating
+    render DS::Pill.new(
+      label: "Subscriptions & Memberships",
+      custom_color: "#7c3aed",
+      icon: "credit-card",
+      icon_size: "sm",
+      marker: false,
+      size: :md,
+      truncate: true
+    )
+  end
 end