diff --git a/packages/shoreline/src/components/filter/filter-value.tsx b/packages/shoreline/src/components/filter/filter-value.tsx
index 3cf799b402..117466cd71 100644
--- a/packages/shoreline/src/components/filter/filter-value.tsx
+++ b/packages/shoreline/src/components/filter/filter-value.tsx
@@ -1,5 +1,6 @@
+import { useSelectContext } from '@ariakit/react'
 import type { ComponentPropsWithoutRef } from 'react'
-import { forwardRef } from 'react'
+import { forwardRef, useCallback } from 'react'
 import { useFilterContext } from './filter-context'
 
 const valueSeparator = ': '
@@ -13,14 +14,25 @@ export const FilterValue = forwardRef<HTMLSpanElement, FilterValueProps>(
     const filter = useFilterContext()
     const value = filter?.useState('value')
 
-    const isArray = Array.isArray(value)
-    const isLongArray = isArray && value.length > 1
+    const valueIsArray = Array.isArray(value)
+    const valueIsMultiSelected = valueIsArray && value.length > 1
+
+    const selectContext = useSelectContext()
+    const items = selectContext?.useState('items')
+
+    const getValueText = useCallback(
+      () =>
+        items?.find((item) =>
+          valueIsArray ? item.value === value[0] : item.value === value
+        )?.element?.innerText,
+      [value, valueIsArray, items]
+    )
 
     return (
       <span data-sl-filter-value ref={ref} {...props}>
         {value && value.length > 0 && valueSeparator}
-        {isArray ? value[0] : value}
-        {isLongArray && `${countPrefix}${value.length - 1}`}
+        {getValueText()}
+        {valueIsMultiSelected && `${countPrefix}${value.length - 1}`}
       </span>
     )
   }
diff --git a/packages/shoreline/src/components/filter/stories/examples.stories.tsx b/packages/shoreline/src/components/filter/stories/examples.stories.tsx
index cef2784273..eb8b5fc5eb 100644
--- a/packages/shoreline/src/components/filter/stories/examples.stories.tsx
+++ b/packages/shoreline/src/components/filter/stories/examples.stories.tsx
@@ -1,20 +1,20 @@
-import { useState, useMemo, startTransition } from 'react'
 import { matchSorter } from 'match-sorter'
+import { startTransition, useMemo, useState } from 'react'
 
+import { EmptyState, Heading, Text } from '../..'
+import { IconMagnifyingGlass } from '../../../icons'
+import { EmptyStateIllustration } from '../../empty-state'
+import { LocaleProvider } from '../../locale'
 import {
-  FilterProvider,
-  FilterPopover,
-  FilterList,
+  Filter,
   FilterItem,
+  FilterList,
+  FilterPopover,
+  FilterProvider,
   FilterTrigger,
-  Filter,
 } from '../index'
 import type { Country } from './countries'
 import { countries } from './countries'
-import { LocaleProvider } from '../../locale'
-import { IconMagnifyingGlass } from '../../../icons'
-import { EmptyState, Text, Heading } from '../..'
-import { EmptyStateIllustration } from '../../empty-state'
 
 export default {
   title: 'components/filter',
@@ -35,6 +35,18 @@ export function Controlled() {
   )
 }
 
+export function CustomLabel() {
+  const [city, setCity] = useState<string>('')
+
+  return (
+    <Filter label="Cidade" value={city} setValue={setCity}>
+      <FilterItem value="rj">Rio de Janeiro</FilterItem>
+      <FilterItem value="sp">São Paulo</FilterItem>
+      <FilterItem value="mg">Minas Gerais</FilterItem>
+    </Filter>
+  )
+}
+
 export function CustomMessages() {
   return (
     <Filter