diff --git a/webui/src/lib/components/utils/Selector.svelte b/webui/src/lib/components/utils/Selector.svelte
index d431480..9e40681 100644
--- a/webui/src/lib/components/utils/Selector.svelte
+++ b/webui/src/lib/components/utils/Selector.svelte
@@ -232,12 +232,13 @@
 			}
 
 			if (types.includes('Attribute')) {
+				let selectorOptions: SelectorOption[] = [];
 				const allAttributes = await api.fetchAllAttributes({ abortController });
 				const attributes = attributeOptions
 					? allAttributes.filter((attr) => attributeOptions!.includes(attr.name))
 					: allAttributes;
 				if (emptyOptions === undefined || query.length > 0) {
-					result.push(
+					selectorOptions.push(
 						...attributes
 							.filter(
 								(attr) =>
@@ -254,6 +255,10 @@
 					);
 				}
 
+				selectorOptions = matchSorter(selectorOptions, inputValue, {
+					keys: [(i) => (i.t === 'Attribute' && i.labels) || [], 'name']
+				});
+
 				const attributeToCreate = query.toUpperCase().replaceAll(/[^A-Z0-9]/g, '_');
 				if (
 					!attributeOptions &&
@@ -261,12 +266,14 @@
 					!allAttributes.map((attr) => attr.name).includes(attributeToCreate) &&
 					types.includes('NewAttribute')
 				) {
-					result.push({
+					selectorOptions.push({
 						t: 'NewAttribute',
 						name: attributeToCreate,
 						label: query
 					});
 				}
+
+				result.push(...selectorOptions);
 			}
 		} catch (e: unknown) {
 			if (e && (e as Error).name !== 'AbortError') {