diff --git a/src/components/tag-input.tsx b/src/components/tag-input.tsx
new file mode 100644
index 0000000..5ebc512
--- /dev/null
+++ b/src/components/tag-input.tsx
@@ -0,0 +1,69 @@
+import { createSignal, For, Show } from "solid-js";
+import { TextInput } from "./text-input";
+
+export const TagInput = (props: {
+  name: string;
+  placeholder?: string;
+  initialValues?: string[];
+}) => {
+  const [tags, setTags] = createSignal<string[]>(props.initialValues ?? []);
+  const [inputValue, setInputValue] = createSignal("");
+
+  const addTag = () => {
+    const value = inputValue().trim();
+    if (value && !tags().includes(value)) {
+      setTags([...tags(), value]);
+      setInputValue("");
+    }
+  };
+
+  const removeTag = (index: number) => {
+    setTags(tags().filter((_, i) => i !== index));
+  };
+
+  const onKeyDown = (e: KeyboardEvent) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      addTag();
+    }
+  };
+
+  return (
+    <div class="flex min-w-0 grow flex-col gap-1.5">
+      <input type="hidden" name={props.name} value={tags().join(",")} />
+      <div class="flex gap-1.5">
+        <TextInput
+          value={inputValue()}
+          onInput={(e) => setInputValue(e.currentTarget.value)}
+          onKeyDown={onKeyDown}
+          placeholder={props.placeholder}
+          class="min-w-0 grow"
+        />
+        <button
+          type="button"
+          onClick={addTag}
+          class="dark:bg-dark-300 dark:hover:bg-dark-200 dark:active:bg-dark-100 flex shrink-0 items-center gap-1 rounded-md border border-neutral-200 bg-neutral-50 px-2.5 py-1 text-xs text-neutral-700 transition-colors select-none hover:bg-neutral-100 active:bg-neutral-200 dark:border-neutral-700 dark:text-neutral-300"
+        >
+          <span class="iconify lucide--plus text-xs"></span>
+          Add
+        </button>
+      </div>
+      <Show when={tags().length > 0}>
+        <div class="flex flex-wrap gap-1">
+          <For each={tags()}>
+            {(tag, index) => (
+              <button
+                type="button"
+                onClick={() => removeTag(index())}
+                class="group dark:bg-dark-200 flex items-center gap-1 rounded-full bg-neutral-200/70 px-2 py-0.5 text-xs text-neutral-700 hover:bg-neutral-300/70 dark:text-neutral-300 dark:hover:bg-neutral-700"
+              >
+                <span class="max-w-48 truncate sm:max-w-none">{tag}</span>
+                <span class="iconify lucide--x text-current opacity-40 group-hover:opacity-100"></span>
+              </button>
+            )}
+          </For>
+        </div>
+      </Show>
+    </div>
+  );
+};
diff --git a/src/components/text-input.tsx b/src/components/text-input.tsx
index b54a5ae..1529e4d 100644
--- a/src/components/text-input.tsx
+++ b/src/components/text-input.tsx
@@ -10,6 +10,7 @@ export interface TextInputProps {
   spellcheck?: boolean;
   value?: string | string[];
   onInput?: (ev: InputEvent & { currentTarget: HTMLInputElement }) => void;
+  onKeyDown?: (ev: KeyboardEvent & { currentTarget: HTMLInputElement }) => void;
 }
 
 export const TextInput = (props: TextInputProps) => {
@@ -29,6 +30,7 @@ export const TextInput = (props: TextInputProps) => {
         props.class
       }
       onInput={props.onInput}
+      onKeyDown={props.onKeyDown}
     />
   );
 };
diff --git a/src/views/labels.tsx b/src/views/labels.tsx
index 1ff5c02..d320fb7 100644
--- a/src/views/labels.tsx
+++ b/src/views/labels.tsx
@@ -7,6 +7,7 @@ import { createMemo, createSignal, For, onMount, Show } from "solid-js";
 import { Button } from "../components/button.jsx";
 import DidHoverCard from "../components/hover-card/did.jsx";
 import RecordHoverCard from "../components/hover-card/record.jsx";
+import { TagInput } from "../components/tag-input.jsx";
 import { TextInput } from "../components/text-input.jsx";
 import { canHover } from "../layout.jsx";
 import { getPDS, labelerCache, resolveHandle } from "../lib/api.js";
@@ -129,12 +130,7 @@ export const LabelView = () => {
 
   const fetchLabels = async (formData: FormData, reset?: boolean) => {
     let did = formData.get("did")?.toString()?.trim() || DEFAULT_LABELER_DID;
-    const uriPatterns = formData.get("uriPatterns")?.toString()?.trim();
-
-    if (!uriPatterns) {
-      setError("Please provide both DID and URI patterns");
-      return;
-    }
+    const uriPatterns = formData.get("uriPatterns")?.toString()?.trim() || "*";
 
     if (reset) {
       setLabels([]);
@@ -219,16 +215,16 @@ export const LabelView = () => {
 
           <label class="flex w-full flex-col gap-y-1">
             <span class="text-sm font-medium text-neutral-700 dark:text-neutral-300">
-              URI patterns (comma-separated)
+              URI patterns
             </span>
-            <textarea
-              id="uriPatterns"
+            <TagInput
               name="uriPatterns"
-              spellcheck={false}
-              rows={2}
-              value={searchParams.uriPatterns ?? "*"}
               placeholder="at://did:web:example.com/app.bsky.feed.post/*"
-              class="dark:bg-dark-100 grow rounded-lg bg-white px-2 py-1.5 text-sm outline-1 outline-neutral-200 focus:outline-neutral-400 dark:outline-neutral-600 dark:focus:outline-neutral-400"
+              initialValues={
+                (searchParams.uriPatterns as string)
+                  ?.split(",")
+                  .filter((v) => v.trim().length > 0) ?? []
+              }
             />
           </label>
         </div>
diff --git a/src/views/stream/config.ts b/src/views/stream/config.ts
index ae6c935..3595d60 100644
--- a/src/views/stream/config.ts
+++ b/src/views/stream/config.ts
@@ -5,7 +5,7 @@ export type StreamType = "jetstream" | "firehose" | "spacedust";
 export type FormField = {
   name: string;
   label: string;
-  type: "text" | "textarea" | "checkbox";
+  type: "text" | "checkbox" | "tags";
   placeholder?: string;
   searchParam: string;
 };
@@ -45,15 +45,15 @@ export const STREAM_CONFIGS: Record<StreamType, StreamConfig> = {
       {
         name: "collections",
         label: "Collections",
-        type: "textarea",
-        placeholder: "Comma-separated list of collections",
+        type: "tags",
+        placeholder: "app.bsky.feed.post",
         searchParam: "collections",
       },
       {
         name: "dids",
         label: "DIDs",
-        type: "textarea",
-        placeholder: "Comma-separated list of DIDs",
+        type: "tags",
+        placeholder: "did:plc:xyz...",
         searchParam: "dids",
       },
       {
@@ -145,22 +145,22 @@ export const STREAM_CONFIGS: Record<StreamType, StreamConfig> = {
       {
         name: "sources",
         label: "Sources",
-        type: "textarea",
-        placeholder: "e.g. app.bsky.graph.follow:subject",
+        type: "tags",
+        placeholder: "app.bsky.graph.follow:subject",
         searchParam: "sources",
       },
       {
         name: "subjectDids",
         label: "Subject DIDs",
-        type: "textarea",
-        placeholder: "Comma-separated list of DIDs",
+        type: "tags",
+        placeholder: "did:plc:xyz...",
         searchParam: "subjectDids",
       },
       {
         name: "subjects",
         label: "Subjects",
-        type: "textarea",
-        placeholder: "Comma-separated list of AT URIs",
+        type: "tags",
+        placeholder: "at://did:plc:xyz.../app.bsky.feed.post/abc",
         searchParam: "subjects",
       },
       {
diff --git a/src/views/stream/index.tsx b/src/views/stream/index.tsx
index e607fbe..d5d942b 100644
--- a/src/views/stream/index.tsx
+++ b/src/views/stream/index.tsx
@@ -4,6 +4,7 @@ import { createSignal, For, onCleanup, onMount, Show } from "solid-js";
 import { Button } from "../../components/button";
 import DidHoverCard from "../../components/hover-card/did";
 import { JSONValue } from "../../components/json";
+import { TagInput } from "../../components/tag-input";
 import { TextInput } from "../../components/text-input";
 import { addToClipboard } from "../../utils/copy";
 import { websocketCloseReasons } from "../../utils/websocket";
@@ -366,7 +367,7 @@ export const StreamView = () => {
 
             <For each={config().fields}>
               {(field) => (
-                <label class="flex items-center justify-end gap-x-1">
+                <label class={`flex justify-end gap-x-1 ${field.type === "tags" ? "items-start" : "items-center"}`}>
                   <Show when={field.type === "checkbox"}>
                     <input
                       type="checkbox"
@@ -375,16 +376,19 @@ export const StreamView = () => {
                       checked={searchParams[field.searchParam] === "on"}
                     />
                   </Show>
-                  <span class="min-w-21 select-none">{field.label}</span>
-                  <Show when={field.type === "textarea"}>
-                    <textarea
+                  <span class={`min-w-21 select-none ${field.type === "tags" ? "mt-1" : ""}`}>{field.label}</span>
+                  <Show when={field.type === "tags"}>
+                    <TagInput
                       name={field.name}
-                      spellcheck={false}
                       placeholder={field.placeholder}
-                      value={(searchParams[field.searchParam] as string) ?? ""}
-                      class="dark:bg-dark-100 grow rounded-lg bg-white px-2 py-1 outline-1 outline-neutral-200 focus:outline-neutral-400 dark:outline-neutral-600 dark:focus:outline-neutral-400"
+                      initialValues={
+                        (searchParams[field.searchParam] as string)
+                          ?.split(",")
+                          .filter((v) => v.trim().length > 0) ?? []
+                      }
                     />
                   </Show>
+
                   <Show when={field.type === "text"}>
                     <TextInput
                       name={field.name}