diff --git a/app/assets/javascripts/environments/components/new_environment_item.vue b/app/assets/javascripts/environments/components/new_environment_item.vue
index 2ec6e12b8b3742419ada4efdac647c6e5fa8e0ec..a945e89393b01b18dc4a37fbc556d74d6e176bb2 100644
--- a/app/assets/javascripts/environments/components/new_environment_item.vue
+++ b/app/assets/javascripts/environments/components/new_environment_item.vue
@@ -223,7 +223,7 @@ export default {
           :icon="icon"
           :aria-label="label"
           size="small"
-          category="tertiary"
+          category="secondary"
           @click="toggleCollapse"
         />
         <gl-link
diff --git a/spec/frontend/environments/new_environment_item_spec.js b/spec/frontend/environments/new_environment_item_spec.js
index c04ff8967945d202d040b09245f94f149050b92d..b2088ad410b2845638d70fbe2e224145c7e90687 100644
--- a/spec/frontend/environments/new_environment_item_spec.js
+++ b/spec/frontend/environments/new_environment_item_spec.js
@@ -382,6 +382,7 @@ describe('~/environments/components/new_environment_item.vue', () => {
       const button = await expandCollapsedSection();
 
       expect(button.attributes('aria-label')).toBe(__('Collapse'));
+      expect(button.props('category')).toBe('secondary');
       expect(collapse.attributes('visible')).toBe('visible');
       expect(icon.props('name')).toBe('chevron-lg-down');
       expect(environmentName.classes('gl-font-weight-bold')).toBe(true);