diff --git a/src/hooks/use-multi-select.tsx b/src/hooks/use-multi-select.tsx
index 125956a..394ee82 100644
--- a/src/hooks/use-multi-select.tsx
+++ b/src/hooks/use-multi-select.tsx
@@ -41,7 +41,10 @@ export const MultiSelectProvider = ({
   children,
 }: MultiSelectProviderProps) => {
   const [options, setOptions] = useState(props.options);
-  const t = (key) => props.overrideStrings?.[key] || defaultStrings[key];
+  const t = (key) =>
+    props.overrideStrings?.[key] ||
+    (key === "selectSomeItems" && props.placeholder) ||
+    defaultStrings[key];  
 
   useEffect(() => {
     setOptions(props.options);
diff --git a/src/lib/interfaces.ts b/src/lib/interfaces.ts
index bfb7554..854a3c2 100644
--- a/src/lib/interfaces.ts
+++ b/src/lib/interfaces.ts
@@ -35,4 +35,5 @@ export interface SelectProps {
   isCreatable?: boolean;
   onCreateOption?;
   closeOnChangedValue?: boolean;
+  placeholder?: string;
 }
diff --git a/src/multi-select/dropdown.tsx b/src/multi-select/dropdown.tsx
index bbe8471..f89e417 100644
--- a/src/multi-select/dropdown.tsx
+++ b/src/multi-select/dropdown.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable prettier/prettier */
 /**
  * A generic dropdown component.  It takes the children of the component
  * and hosts it in the component.  When the component is selected, it
diff --git a/src/multi-select/header.tsx b/src/multi-select/header.tsx
index 9026798..e2e590f 100644
--- a/src/multi-select/header.tsx
+++ b/src/multi-select/header.tsx
@@ -1,5 +1,4 @@
 import React from "react";
-
 import { useMultiSelect } from "../hooks/use-multi-select";
 
 export const DropdownHeader = () => {
@@ -12,7 +11,7 @@ export const DropdownHeader = () => {
   const getSelectedText = () => value.map((s) => s.label).join(", ");
 
   return noneSelected ? (
-    <span className="gray">{customText || t("selectSomeItems")}</span>
+    <span className="placeholder">{customText || t("selectSomeItems")}</span>
   ) : (
     <span>
       {customText ||