diff --git a/packages/calcite-components/src/components/stepper-item/stepper-item.scss b/packages/calcite-components/src/components/stepper-item/stepper-item.scss
index ee83e4a6b92..afb4fd0036c 100644
--- a/packages/calcite-components/src/components/stepper-item/stepper-item.scss
+++ b/packages/calcite-components/src/components/stepper-item/stepper-item.scss
@@ -73,6 +73,10 @@
 // .stepper-item-header / content
 :host .stepper-item-header {
   @apply flex cursor-pointer items-start;
+
+  &:active {
+    @apply bg-foreground-3;
+  }
 }
 
 :host .stepper-item-content,