diff --git a/skore-ui/src/components/DataFrameWidget.vue b/skore-ui/src/components/DataFrameWidget.vue
index 065937da6..ab33435f4 100644
--- a/skore-ui/src/components/DataFrameWidget.vue
+++ b/skore-ui/src/components/DataFrameWidget.vue
@@ -206,6 +206,7 @@ watch(
       & tr {
         position: relative;
         padding: var(--spacing-4);
+        color: var(--color-text-secondary);
 
         & td {
           padding: var(--spacing-4);
diff --git a/skore-ui/src/components/TextInput.vue b/skore-ui/src/components/TextInput.vue
index 81d6f0453..cc9431f0b 100644
--- a/skore-ui/src/components/TextInput.vue
+++ b/skore-ui/src/components/TextInput.vue
@@ -53,6 +53,7 @@ onMounted(() => {
 
   .icon {
     margin: 0 var(--spacing-10);
+    color: var(--color-text-primary);
   }
 
   input {
@@ -60,11 +61,15 @@ onMounted(() => {
     min-width: 0;
     border: none;
     background-color: transparent;
-    color: inherit;
+    color: var(--color-text-primary);
 
     &:focus {
       outline: none;
     }
+
+    &::placeholder {
+      color: var(--color-text-secondary);
+    }
   }
 
   &:has(input:focus) {