diff --git a/.changeset/fix-placeholder-color.md b/.changeset/fix-placeholder-color.md
new file mode 100644
index 000000000..646f259af
--- /dev/null
+++ b/.changeset/fix-placeholder-color.md
@@ -0,0 +1,5 @@
+---
+'@cube-dev/ui-kit': patch
+---
+
+Fix placeholder color in input recipes to use `#placeholder` token consistently
diff --git a/src/components/Root.tsx b/src/components/Root.tsx
index 491888b6c..9aa344102 100644
--- a/src/components/Root.tsx
+++ b/src/components/Root.tsx
@@ -80,8 +80,8 @@ configure({
       },
     },
     'input-placeholder': {
-      '-webkit-text-fill-color': 'var(--placeholder-color, initial)',
-      color: 'var(--placeholder-color, initial)',
+      '-webkit-text-fill-color': '#placeholder',
+      color: '#placeholder',
     },
     'input-search-cancel-button': {
       hide: true,
diff --git a/src/components/fields/TextInput/TextInput.stories.tsx b/src/components/fields/TextInput/TextInput.stories.tsx
index 1d96b1aad..3b462e215 100644
--- a/src/components/fields/TextInput/TextInput.stories.tsx
+++ b/src/components/fields/TextInput/TextInput.stories.tsx
@@ -160,7 +160,11 @@ export default {
 };
 
 const Template: StoryFn<CubeTextInputProps> = (props) => (
-  <TextInput {...props} onChange={(query) => console.log('change', query)} />
+  <TextInput
+    placeholder="Placeholder"
+    {...props}
+    onChange={(query) => console.log('change', query)}
+  />
 );
 
 export const Default = Template.bind({});