diff --git a/src/components/Publish/Navigation/index.module.css b/src/components/Publish/Navigation/index.module.css
index 75a1a4712..c7eb3250d 100644
--- a/src/components/Publish/Navigation/index.module.css
+++ b/src/components/Publish/Navigation/index.module.css
@@ -90,4 +90,5 @@
 
 .success.current:before {
   background: var(--font-color-heading);
+  border-color: var(--brand-alert-green);
 }
diff --git a/src/components/Publish/Navigation/index.tsx b/src/components/Publish/Navigation/index.tsx
index 259167313..772408435 100644
--- a/src/components/Publish/Navigation/index.tsx
+++ b/src/components/Publish/Navigation/index.tsx
@@ -21,7 +21,8 @@ export default function Navigation(): ReactElement {
     const isSuccessServices = errors.services === undefined
     const isSuccessPricing =
       errors.pricing === undefined && touched.pricing?.price
-    const isSuccessPreview = false
+    const isSuccessPreview =
+      isSuccessMetadata && isSuccessServices && isSuccessPricing
 
     const isSuccess =
       (step === 1 && isSuccessMetadata) ||
@@ -38,7 +39,6 @@ export default function Navigation(): ReactElement {
           <li
             key={step.title}
             onClick={() => handleStepClick(step.step)}
-            // TODO: add success class for all steps
             className={`${
               values.user.stepCurrent === step.step ? styles.current : null
             } ${getSuccessClass(step.step)}`}