diff --git a/.changeset/famous-ants-shout.md b/.changeset/famous-ants-shout.md
new file mode 100644
index 00000000..470428da
--- /dev/null
+++ b/.changeset/famous-ants-shout.md
@@ -0,0 +1,12 @@
+---
+"@igloo-ui/combobox": patch
+"@igloo-ui/input": patch
+"@igloo-ui/textarea": patch
+"@igloo-ui/datepicker": patch
+"@igloo-ui/form-group": patch
+"@igloo-ui/select": patch
+"@igloo-ui/tag-picker": patch
+"@igloo-ui/text-editor": patch
+---
+
+UI fix for focused state
diff --git a/.changeset/loud-dancers-jump.md b/.changeset/loud-dancers-jump.md
new file mode 100644
index 00000000..f4e3ab0f
--- /dev/null
+++ b/.changeset/loud-dancers-jump.md
@@ -0,0 +1,5 @@
+---
+"@igloo-ui/tag-picker": patch
+---
+
+Added focus border color
diff --git a/packages/Combobox/src/Combobox.tsx b/packages/Combobox/src/Combobox.tsx
index 68999bdd..87154c95 100644
--- a/packages/Combobox/src/Combobox.tsx
+++ b/packages/Combobox/src/Combobox.tsx
@@ -397,6 +397,7 @@ const Combobox: React.FunctionComponent<ComboboxProps> = ({
     const comboboxClassname = cx("ids-combobox", className, {
         "ids-combobox--active": canShowMenu,
         "ids-combobox--compact": isCompact,
+        "ids-combobox--search": search,
         "ids-combobox--disabled": disabled,
         "ids-combobox--error": error
     });
diff --git a/packages/Combobox/src/ComboboxInput.tsx b/packages/Combobox/src/ComboboxInput.tsx
index e9a8c42c..0d3fef6b 100644
--- a/packages/Combobox/src/ComboboxInput.tsx
+++ b/packages/Combobox/src/ComboboxInput.tsx
@@ -72,10 +72,10 @@ const ComboboxInput: React.FunctionComponent<ComboboxInputProps> = ({
     const isWorkleap = getBrand() === "workleap";
     const chevronClass = "ids-combobox-input__chevron";
     const chevronUpIcon = isWorkleap ?
-        <AngleUpIcon className={chevronClass} size="sm" /> : 
+        <AngleUpIcon className={chevronClass} size="sm" /> :
         <ChevronUp className={chevronClass} size="small" />;
-    const chevronDownIcon = isWorkleap ? 
-        <AngleDownIcon className={chevronClass} size="sm" /> : 
+    const chevronDownIcon = isWorkleap ?
+        <AngleDownIcon className={chevronClass} size="sm" /> :
         <ChevronDown className={chevronClass} size="small" />;
 
     const handleChange = ({
diff --git a/packages/Combobox/src/combobox.scss b/packages/Combobox/src/combobox.scss
index 005b240e..505f943c 100644
--- a/packages/Combobox/src/combobox.scss
+++ b/packages/Combobox/src/combobox.scss
@@ -36,7 +36,6 @@
         --ids-combobox-background-focus: #{tokens.$samoyed};
         --ids-combobox-focus: none;
 
-
         /* Disabled */
         --ids-combobox-color-disabled: #{tokens.$grey-500};
         --ids-combobox-background-disabled: #{tokens.$grey-200};
@@ -76,6 +75,7 @@
         /* Active */
         --ids-combobox-background-active: var(--hop-neutral-surface);
         --ids-combobox-border-color-active: var(--hop-neutral-border-active);
+        --ids-combobox-search-border-color-active: var(--hop-primary-border-focus);
 
         /* Focus */
         --ids-combobox-background-focus: var(--hop-neutral-surface-hover);
@@ -139,8 +139,8 @@
         &:focus-visible,
         &.focus {
             background-color: var(--ids-combobox-background-focus);
-            box-shadow: var(--ids-combobox-focus);
             border-color: var(--ids-combobox-border-color-focus);
+            box-shadow: var(--ids-combobox-focus);
         }
 
         &--active,
@@ -167,6 +167,7 @@
             color: var(--ids-combobox-color-disabled);
             background-color: var(--ids-combobox-background-disabled);
             border-color: var(--ids-combobox-border-color-disabled);
+            box-shadow: none;
             cursor: not-allowed;
 
             &:hover {
@@ -180,6 +181,11 @@
         }
     }
 
+    .ids-combobox--search.ids-combobox--active,
+    .ids-combobox.active .ids-combobox--search {
+        border-color: var(--ids-combobox-search-border-color-active);
+    }
+
     .ids-combobox__dropdown {
         outline: none;
     }
diff --git a/packages/Input/src/input.scss b/packages/Input/src/input.scss
index bfde3830..b194ae4f 100644
--- a/packages/Input/src/input.scss
+++ b/packages/Input/src/input.scss
@@ -104,11 +104,10 @@
         --ids-input-background-hover: var(--hop-neutral-surface-hover);
 
         /* Focus */
-        --ids-input-border-color-focus: var(--hop-neutral-border-hover);
-        --ids-input-focus: 0 0 0 0.12rem var(--hop-neutral-surface), 0 0 0 0.219rem var(--hop-primary-border-focus);
+        --ids-input-border-color-focus: var(--hop-primary-border-focus);
 
         /* Active */
-        --ids-input-border-color-active: var(--hop-neutral-border-active);
+        --ids-input-border-color-active: var(--hop-primary-border-active);
 
         /* disabled */
         --ids-input-color-disabled: var(--hop-neutral-text-disabled);
@@ -275,7 +274,6 @@
         outline: 0;
         outline-offset: 0;
         border: var(--ids-input-border-size) solid var(--ids-input-border-color-active);
-        box-shadow: var(--ids-input-focus, none);
     }
 
     .ids-input:active,
diff --git a/packages/TagPicker/src/tag-picker.scss b/packages/TagPicker/src/tag-picker.scss
index 0e42eafe..917ee3b3 100644
--- a/packages/TagPicker/src/tag-picker.scss
+++ b/packages/TagPicker/src/tag-picker.scss
@@ -52,8 +52,7 @@
         --ids-tag-picker-border-size: 0.0625rem;
         --ids-tag-picker-border-color: var(--hop-neutral-border);
         --ids-tag-picker-border-color-hover: var(--hop-neutral-border-hover);
-        --ids-tag-picker-border-color-focus: var(--hop-neutral-border-hover);
-        --ids-tag-picker-focus: 0 0 0 0.12rem var(--hop-neutral-surface), 0 0 0 0.219rem var(--hop-primary-border-focus);
+        --ids-tag-picker-border-color-focus: var(--hop-primary-border-focus);
         --ids-tag-picker-border-color-error: var(--hop-danger-border-strong);
         --ids-tag-picker-border-radius: var(--hop-shape-rounded-md);
         --ids-tag-picker-font-family: var(--hop-body-md-font-family);
@@ -108,7 +107,6 @@
 
         &--focused {
             border-color: var(--ids-tag-picker-border-color-focus);
-            box-shadow: var(--ids-tag-picker-focus);
         }
 
         &--disabled {
diff --git a/packages/TextEditor/src/text-editor.scss b/packages/TextEditor/src/text-editor.scss
index ee6b99c2..607202fa 100644
--- a/packages/TextEditor/src/text-editor.scss
+++ b/packages/TextEditor/src/text-editor.scss
@@ -122,8 +122,7 @@
         --ids-text-editor-background-hover: var(--hop-neutral-surface-hover);
 
         /* Focus */
-        --ids-text-editor-border-color-focus: var(--hop-neutral-border-active);
-        --ids-text-editor-focus: 0 0 0 0.12rem var(--hop-neutral-surface), 0 0 0 0.219rem var(--hop-primary-border-focus);
+        --ids-text-editor-border-color-focus: var(--hop-primary-border-active);
 
         /* Disabled */
         --ids-text-editor-background-disabled: var(--hop-neutral-surface-disabled);
diff --git a/packages/Textarea/src/textarea.scss b/packages/Textarea/src/textarea.scss
index e8deb43f..15aeecd1 100644
--- a/packages/Textarea/src/textarea.scss
+++ b/packages/Textarea/src/textarea.scss
@@ -59,8 +59,7 @@
         --ids-textarea-color-placeholder: var(--hop-neutral-text-weakest);
 
         /* Focus */
-        --ids-textarea-focus-border-color: var(--hop-neutral-border-active);
-        --ids-textarea-focus-box-shadow: 0 0 0 0.12rem var(--hop-neutral-surface), 0 0 0 0.219rem var(--hop-primary-border-focus);
+        --ids-textarea-focus-border-color: var(-hop-primary-border-focus);
 
         /* Hover */
         --ids-textarea-hover-border-color: var(--hop-neutral-border-hover);