diff --git a/packages/clay-css/src/scss/atlas/variables/_application-bar.scss b/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
index 37d34ab6ce..2bbe076ab2 100644
--- a/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_application-bar.scss
@@ -15,7 +15,7 @@ $application-bar-base: map-deep-merge(
 				outline: 0,
 				transition: box-shadow 0.15s ease-in-out,
 				focus: (
-					box-shadow: $btn-focus-box-shadow,
+					box-shadow: $component-focus-box-shadow,
 				),
 				disabled: (
 					box-shadow: none,
diff --git a/packages/clay-css/src/scss/atlas/variables/_buttons.scss b/packages/clay-css/src/scss/atlas/variables/_buttons.scss
index 3a5948776f..13fda499cb 100644
--- a/packages/clay-css/src/scss/atlas/variables/_buttons.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_buttons.scss
@@ -3,12 +3,11 @@ $btn-box-shadow: none !default;
 $btn-font-weight: $font-weight-semi-bold !default;
 $btn-padding-x: 0.9375rem !default; // 15px
 $btn-padding-y: 0.4375rem !default; // 7px
-$btn-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
-	border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !default;
+$btn-transition: $component-transition !default;
 
 $btn-focus-box-shadow: $component-focus-box-shadow !default;
 
-$btn-disabled-opacity: 0.4 !default;
+$btn-disabled-opacity: $component-disabled-opacity !default;
 
 $btn-active-box-shadow: c-unset !default;
 
diff --git a/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss b/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
index 7a08c5e70b..56f6322cb2 100644
--- a/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_dropdowns.scss
@@ -247,9 +247,13 @@ $dropdown-action-toggle-font-size: 1rem !default; // 16px
 
 /// @deprecated as of v3.x use map $dropdown-action instead
 
-$dropdown-action-toggle-disabled-opacity: $btn-disabled-opacity !default;
+$dropdown-action-toggle-disabled-opacity: $component-disabled-opacity !default;
 
-$dropdown-action-toggle-size: $btn-monospaced-size-sm !default;
+$dropdown-action-toggle-size: if(
+	variable-exists(btn-monospaced-size-sm),
+	$btn-monospaced-size-sm,
+	2rem
+) !default;
 
 $dropdown-action: () !default;
 $dropdown-action: map-deep-merge(
diff --git a/packages/clay-css/src/scss/atlas/variables/_labels.scss b/packages/clay-css/src/scss/atlas/variables/_labels.scss
index 2a36c0f4c3..46c8a100a4 100644
--- a/packages/clay-css/src/scss/atlas/variables/_labels.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_labels.scss
@@ -40,7 +40,7 @@ $label: map-deep-merge(
 				text-decoration: $label-anchor-hover-text-decoration,
 			),
 			focus: (
-				box-shadow: $btn-focus-box-shadow,
+				box-shadow: $component-focus-box-shadow,
 				text-decoration: $label-anchor-hover-text-decoration,
 			),
 		),
diff --git a/packages/clay-css/src/scss/atlas/variables/_links.scss b/packages/clay-css/src/scss/atlas/variables/_links.scss
index 5a32dba8bf..1efc51c2ee 100644
--- a/packages/clay-css/src/scss/atlas/variables/_links.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_links.scss
@@ -138,6 +138,7 @@ $link-outline-primary: map-deep-merge(
 		),
 		focus: (
 			background-color: $primary-l3,
+			box-shadow: $component-focus-box-shadow,
 			color: $primary,
 		),
 		active: (
@@ -145,6 +146,9 @@ $link-outline-primary: map-deep-merge(
 				clay-lighten(clay-desaturate($primary, 42.05), 41.76),
 			color: $primary,
 		),
+		disabled: (
+			box-shadow: none,
+		),
 	),
 	$link-outline-primary
 );
@@ -159,6 +163,7 @@ $link-outline-secondary: map-deep-merge(
 		),
 		focus: (
 			background-color: rgba($gray-900, 0.03),
+			box-shadow: $component-focus-box-shadow,
 			color: $gray-900,
 		),
 		active: (
diff --git a/packages/clay-css/src/scss/atlas/variables/_management-bar.scss b/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
index be048a50fb..e5afaa4ed9 100644
--- a/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_management-bar.scss
@@ -7,7 +7,7 @@ $management-bar-base: map-deep-merge(
 				outline: 0,
 				transition: box-shadow 0.15s ease-in-out,
 				focus: (
-					box-shadow: $btn-focus-box-shadow,
+					box-shadow: $component-focus-box-shadow,
 				),
 				disabled: (
 					box-shadow: none,
diff --git a/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss b/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
index 7b81cd5e7c..b8b81fa19f 100644
--- a/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_navigation-bar.scss
@@ -20,7 +20,7 @@ $navigation-bar-base: map-deep-merge(
 				border-radius: 0px,
 				outline: 0,
 				focus: (
-					box-shadow: $btn-focus-box-shadow,
+					box-shadow: $component-focus-box-shadow,
 				),
 				disabled: (
 					box-shadow: none,
@@ -49,7 +49,7 @@ $navigation-bar-light: map-deep-merge(
 				),
 				disabled: (
 					color: $gray-600,
-					opacity: $btn-disabled-opacity,
+					opacity: $component-disabled-opacity,
 				),
 			),
 		),
@@ -72,7 +72,7 @@ $navigation-bar-light: map-deep-merge(
 								),
 								disabled: (
 									color: $gray-600,
-									opacity: $btn-disabled-opacity,
+									opacity: $component-disabled-opacity,
 								),
 							),
 						),
@@ -103,7 +103,7 @@ $navigation-bar-secondary: map-deep-merge(
 				),
 				disabled: (
 					color: $gray-400,
-					opacity: $btn-disabled-opacity,
+					opacity: $component-disabled-opacity,
 				),
 			),
 		),
@@ -126,7 +126,7 @@ $navigation-bar-secondary: map-deep-merge(
 								),
 								disabled: (
 									color: $gray-400,
-									opacity: $btn-disabled-opacity,
+									opacity: $component-disabled-opacity,
 								),
 							),
 						),
diff --git a/packages/clay-css/src/scss/atlas/variables/_quick-action.scss b/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
index 77655ee189..878af435b1 100644
--- a/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_quick-action.scss
@@ -1,3 +1,3 @@
 $quick-action-font-size: 1rem !default; // 16px
 
-$quick-action-item-disabled-opacity: $btn-disabled-opacity !default;
+$quick-action-item-disabled-opacity: $component-disabled-opacity !default;
diff --git a/packages/clay-css/src/scss/atlas/variables/_tables.scss b/packages/clay-css/src/scss/atlas/variables/_tables.scss
index 2b03594fe2..17404d207b 100644
--- a/packages/clay-css/src/scss/atlas/variables/_tables.scss
+++ b/packages/clay-css/src/scss/atlas/variables/_tables.scss
@@ -95,7 +95,7 @@ $table-action-link: map-deep-merge(
 	(
 		color: $gray-600,
 		font-size: 1rem,
-		transition: $btn-transition,
+		transition: $component-transition,
 		hover: (
 			background-color: rgba(0, 0, 0, 0.02),
 			color: $gray-900,
@@ -209,7 +209,7 @@ $table-list-action-link: map-deep-merge(
 	(
 		color: $gray-600,
 		font-size: 1rem,
-		transition: $btn-transition,
+		transition: $component-transition,
 		hover: (
 			background-color: rgba(0, 0, 0, 0.02),
 			color: $gray-900,
diff --git a/packages/clay-css/src/scss/components/_custom-forms.scss b/packages/clay-css/src/scss/components/_custom-forms.scss
index 7a390d0f4c..500a93a83c 100644
--- a/packages/clay-css/src/scss/components/_custom-forms.scss
+++ b/packages/clay-css/src/scss/components/_custom-forms.scss
@@ -47,7 +47,7 @@
 
 		+ .input-group {
 			border-radius: 1px;
-			box-shadow: 0 0 0 0.075rem #fff, $btn-focus-box-shadow;
+			box-shadow: $component-focus-box-shadow;
 		}
 	}
 
diff --git a/packages/clay-css/src/scss/components/_links.scss b/packages/clay-css/src/scss/components/_links.scss
index 790bb292d5..eadbae1d80 100644
--- a/packages/clay-css/src/scss/components/_links.scss
+++ b/packages/clay-css/src/scss/components/_links.scss
@@ -17,7 +17,7 @@
 // Link Outline
 
 button.link-outline {
-	cursor: $btn-cursor;
+	cursor: $link-cursor;
 }
 
 .link-outline {
diff --git a/packages/clay-css/src/scss/variables/_alerts.scss b/packages/clay-css/src/scss/variables/_alerts.scss
index 7bf31d2fef..8b3dbd563b 100644
--- a/packages/clay-css/src/scss/variables/_alerts.scss
+++ b/packages/clay-css/src/scss/variables/_alerts.scss
@@ -14,13 +14,36 @@ $alert-padding-y: 0.75rem !default;
 $alert-btn: () !default;
 $alert-btn: map-deep-merge(
 	(
-		border-radius: $btn-border-radius-sm,
-		font-size: $btn-font-size-sm,
-		line-height: $btn-line-height-sm,
-		padding-bottom: $btn-padding-y-sm,
-		padding-left: $btn-padding-x-sm,
-		padding-right: $btn-padding-x-sm,
-		padding-top: $btn-padding-y-sm,
+		border-radius:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, border-radius),
+				$border-radius-sm
+			),
+		font-size:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, font-size),
+				$font-size-sm
+			),
+		line-height:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, line-height),
+				$line-height-sm
+			),
+		padding-bottom:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, padding-bottom),
+				0.25rem
+			),
+		padding-left:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-left), 0.5rem),
+		padding-right:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-right), 0.5rem),
+		padding-top:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-top), 0.25rem),
 	),
 	$alert-btn
 );
diff --git a/packages/clay-css/src/scss/variables/_badges.scss b/packages/clay-css/src/scss/variables/_badges.scss
index b700622d1f..3b0f1bb2d3 100644
--- a/packages/clay-css/src/scss/variables/_badges.scss
+++ b/packages/clay-css/src/scss/variables/_badges.scss
@@ -11,7 +11,7 @@ $badge-font-size: 75% !default;
 $badge-font-weight: $font-weight-bold !default;
 $badge-padding-x: 0.4em !default;
 $badge-padding-y: 0.25em !default;
-$badge-transition: $btn-transition !default;
+$badge-transition: $component-transition !default;
 
 $badge-spacer-x: 0.25rem !default; // 4px
 $badge-spacer-y: 0.125rem !default; // 2px
diff --git a/packages/clay-css/src/scss/variables/_buttons.scss b/packages/clay-css/src/scss/variables/_buttons.scss
index f16a77d279..63d094d027 100644
--- a/packages/clay-css/src/scss/variables/_buttons.scss
+++ b/packages/clay-css/src/scss/variables/_buttons.scss
@@ -9,8 +9,7 @@ $btn-font-weight: $font-weight-normal !default;
 $btn-line-height: $input-btn-line-height !default;
 $btn-padding-x: $input-btn-padding-x !default;
 $btn-padding-y: $input-btn-padding-y !default;
-$btn-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
-	border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !default;
+$btn-transition: $component-transition !default;
 $btn-white-space: null !default;
 
 $btn-font-size-mobile: null !default;
@@ -23,7 +22,7 @@ $btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
 $btn-active-box-shadow: inset 0 3px 5px rgba($black, 0.125) !default;
 
 $btn-disabled-cursor: $disabled-cursor !default;
-$btn-disabled-opacity: 0.65 !default;
+$btn-disabled-opacity: $component-disabled-opacity !default;
 
 $btn-inline-item-font-size: null !default;
 
diff --git a/packages/clay-css/src/scss/variables/_cards.scss b/packages/clay-css/src/scss/variables/_cards.scss
index 86108a5035..b0586bb2d6 100644
--- a/packages/clay-css/src/scss/variables/_cards.scss
+++ b/packages/clay-css/src/scss/variables/_cards.scss
@@ -679,7 +679,7 @@ $card-interactive: map-deep-merge(
 	(
 		cursor: $link-cursor,
 		outline: 0,
-		transition: $btn-transition,
+		transition: $component-transition,
 		hover: (
 			background-color: $gray-100,
 			text-decoration: none,
diff --git a/packages/clay-css/src/scss/variables/_clay-color.scss b/packages/clay-css/src/scss/variables/_clay-color.scss
index aad634fba5..c8df2b284d 100644
--- a/packages/clay-css/src/scss/variables/_clay-color.scss
+++ b/packages/clay-css/src/scss/variables/_clay-color.scss
@@ -93,7 +93,7 @@ $clay-color-dropdown-menu-component-action: map-deep-merge(
 	(
 		hover-bg: transparent,
 		hover-color: $black,
-		focus-box-shadow: $btn-focus-box-shadow,
+		focus-box-shadow: $component-focus-box-shadow,
 		focus-color: $black,
 	),
 	$clay-color-dropdown-menu-component-action
@@ -170,7 +170,7 @@ $clay-color-pointer: map-deep-merge(
 		position: absolute,
 		transition: box-shadow 0.15s ease-in-out,
 		width: 0.875rem,
-		focus-box-shadow: $btn-focus-box-shadow,
+		focus-box-shadow: $component-focus-box-shadow,
 		focus-outline: 0,
 	),
 	$clay-color-pointer
diff --git a/packages/clay-css/src/scss/variables/_date-picker.scss b/packages/clay-css/src/scss/variables/_date-picker.scss
index 3199003f47..e1c7afc612 100644
--- a/packages/clay-css/src/scss/variables/_date-picker.scss
+++ b/packages/clay-css/src/scss/variables/_date-picker.scss
@@ -30,13 +30,13 @@ $date-picker-nav-btn: () !default;
 $date-picker-nav-btn: map-deep-merge(
 	(
 		color: $gray-600,
-		transition: $btn-transition,
+		transition: $component-transition,
 		hover-bg: $gray-200,
 		focus-box-shadow: $input-btn-focus-box-shadow,
 		disabled-bg: transparent,
 		disabled-box-shadow: none,
 		disabled-color: $gray-600,
-		disabled-opacity: $btn-disabled-opacity,
+		disabled-opacity: $component-disabled-opacity,
 	),
 	$date-picker-nav-btn
 );
@@ -184,7 +184,7 @@ $date-picker-calendar-item: map-deep-merge(
 		padding-left: 0,
 		padding-right: 0,
 		padding-top: 0,
-		transition: $btn-transition,
+		transition: $component-transition,
 		user-select: none,
 		vertical-align: middle,
 		white-space: nowrap,
@@ -207,7 +207,7 @@ $date-picker-date: map-deep-merge(
 		active-color: $component-active-color,
 		disabled-bg: transparent,
 		disabled-box-shadow: none,
-		disabled-opacity: $btn-disabled-opacity,
+		disabled-opacity: $component-disabled-opacity,
 	),
 	$date-picker-date
 );
diff --git a/packages/clay-css/src/scss/variables/_dropdowns.scss b/packages/clay-css/src/scss/variables/_dropdowns.scss
index 73c4941f24..885e52f4e2 100644
--- a/packages/clay-css/src/scss/variables/_dropdowns.scss
+++ b/packages/clay-css/src/scss/variables/_dropdowns.scss
@@ -840,7 +840,11 @@ $dropdown-action-toggle-disabled-cursor: $disabled-cursor !default;
 
 $dropdown-action-toggle-disabled-opacity: 0.65 !default;
 
-$dropdown-action-toggle-size: $btn-monospaced-size-sm !default;
+$dropdown-action-toggle-size: if(
+	variable-exists(btn-monospaced-size-sm),
+	$btn-monospaced-size-sm,
+	1.9375rem
+) !default;
 
 $dropdown-action: () !default;
 $dropdown-action: map-deep-merge(
@@ -852,7 +856,7 @@ $dropdown-action: map-deep-merge(
 			align-items: center,
 			border-radius:
 				clay-enable-rounded($dropdown-action-toggle-border-radius),
-			cursor: $btn-cursor,
+			cursor: $link-cursor,
 			display: flex,
 			font-size: inherit,
 			font-weight: inherit,
diff --git a/packages/clay-css/src/scss/variables/_forms.scss b/packages/clay-css/src/scss/variables/_forms.scss
index 3149f20ee1..d63c772f7f 100644
--- a/packages/clay-css/src/scss/variables/_forms.scss
+++ b/packages/clay-css/src/scss/variables/_forms.scss
@@ -497,8 +497,10 @@ $form-control-tag-group-btn: map-deep-merge(
 		margin-bottom: $form-control-inset-margin-y,
 		margin-top: $form-control-inset-margin-y,
 		padding-bottom: 0,
-		padding-left: $btn-padding-x-sm,
-		padding-right: $btn-padding-x-sm,
+		padding-left:
+			if(variable-exists(btn-padding-x-sm), $btn-padding-x-sm, 0.5rem),
+		padding-right:
+			if(variable-exists(btn-padding-x-sm), $btn-padding-x-sm, 0.5rem),
 		padding-top: 0,
 	),
 	$form-control-tag-group-btn
@@ -1531,24 +1533,77 @@ $input-group-lg-item-btn: () !default; // .input-group-lg .input-group-item
 $input-group-lg-item-btn: map-deep-merge(
 	(
 		breakpoint-down: null,
-		font-size: $btn-font-size-lg,
-		line-height: map-get($btn-lg, line-height),
-		padding-bottom: map-get($btn-lg, padding-bottom),
-		padding-left: map-get($btn-lg, padding-left),
-		padding-right: map-get($btn-lg, padding-right),
-		padding-top: map-get($btn-lg, padding-top),
+		font-size:
+			if(
+				variable-exists(btn-lg),
+				map-get($btn-lg, font-size),
+				$font-size-lg
+			),
+		line-height:
+			if(
+				variable-exists(btn-lg),
+				map-get($btn-lg, line-height),
+				$line-height-lg
+			),
+		padding-bottom:
+			if(
+				variable-exists(btn-lg),
+				map-get($btn-lg, padding-bottom),
+				0.375rem
+			),
+		padding-left:
+			if(variable-exists(btn-lg), map-get($btn-lg, padding-left), 1rem),
+		padding-right:
+			if(variable-exists(btn-lg), map-get($btn-lg, padding-right), 1rem),
+		padding-top:
+			if(variable-exists(btn-lg), map-get($btn-lg, padding-top), 0.375rem),
 		inline-item: (
-			font-size: $btn-inline-item-font-size-lg,
+			font-size:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, inline-item, font-size),
+					null
+				),
 		),
 		btn-section: (
-			font-size: $btn-section-font-size-lg,
+			font-size:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, btn-section, font-size),
+					0.8125rem
+				),
 		),
 		mobile: (
-			font-size: $btn-font-size-lg-mobile,
-			padding-bottom: $btn-padding-y-lg-mobile,
-			padding-left: $btn-padding-x-lg-mobile,
-			padding-right: $btn-padding-x-lg-mobile,
-			padding-top: $btn-padding-y-lg-mobile,
+			font-size:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, mobile, font-size),
+					null
+				),
+			padding-bottom:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, mobile, padding-bottom),
+					null
+				),
+			padding-left:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, mobile, padding-left),
+					null
+				),
+			padding-right:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, mobile, padding-right),
+					null
+				),
+			padding-top:
+				if(
+					variable-exists(btn-lg),
+					map-deep-get($btn-lg, mobile, padding-top),
+					null
+				),
 		),
 	),
 	$input-group-lg-item-btn
@@ -1558,16 +1613,56 @@ $input-group-lg-item-btn-monospaced: () !default;
 $input-group-lg-item-btn-monospaced: map-deep-merge(
 	(
 		breakpoint-down: null,
-		height: $btn-monospaced-size-lg,
+		height:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, height),
+				3rem
+			),
 		line-height: 1,
-		padding-bottom: $btn-monospaced-padding-y-lg,
-		padding-left: $btn-monospaced-padding-x-lg,
-		padding-right: $btn-monospaced-padding-x-lg,
-		padding-top: $btn-monospaced-padding-y-lg,
-		width: $btn-monospaced-size-lg,
+		padding-bottom:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, padding-bottom),
+				null
+			),
+		padding-left:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, padding-left),
+				null
+			),
+		padding-right:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, padding-right),
+				null
+			),
+		padding-top:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, padding-top),
+				null
+			),
+		width:
+			if(
+				variable-exists(btn-monospaced-lg),
+				map-get($btn-monospaced-lg, width),
+				3rem
+			),
 		mobile: (
-			height: $btn-monospaced-size-lg-mobile,
-			width: $btn-monospaced-size-lg-mobile,
+			height:
+				if(
+					variable-exists(btn-monospaced-lg),
+					map-deep-get($btn-monospaced-lg, mobile, height),
+					null
+				),
+			width:
+				if(
+					variable-exists(btn-monospaced-lg),
+					map-deep-get($btn-monospaced-lg, mobile, width),
+					null
+				),
 		),
 	),
 	$input-group-lg-item-btn-monospaced
@@ -1683,24 +1778,77 @@ $input-group-addon-padding-y-sm: null !default;
 $input-group-sm-item-btn: () !default;
 $input-group-sm-item-btn: map-deep-merge(
 	(
-		font-size: $btn-font-size-sm,
-		line-height: map-get($btn-sm, line-height),
-		padding-bottom: map-get($btn-sm, padding-bottom),
-		padding-left: map-get($btn-sm, padding-left),
-		padding-right: map-get($btn-sm, padding-right),
-		padding-top: map-get($btn-sm, padding-top),
+		font-size:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, font-size),
+				$font-size-sm
+			),
+		line-height:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, line-height),
+				$line-height-sm
+			),
+		padding-bottom:
+			if(
+				variable-exists(btn-sm),
+				map-get($btn-sm, padding-bottom),
+				0.25rem
+			),
+		padding-left:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-left), 0.5rem),
+		padding-right:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-right), 0.5rem),
+		padding-top:
+			if(variable-exists(btn-sm), map-get($btn-sm, padding-top), 0.25rem),
 		inline-item: (
-			font-size: $btn-inline-item-font-size-sm,
+			font-size:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, inline-item, font-size),
+					null
+				),
 		),
 		btn-section: (
-			font-size: $btn-section-font-size-sm,
+			font-size:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, btn-section, font-size),
+					0.5625rem
+				),
 		),
 		mobile: (
-			font-size: $btn-font-size-sm-mobile,
-			padding-bottom: $btn-padding-y-sm-mobile,
-			padding-left: $btn-padding-x-sm-mobile,
-			padding-right: $btn-padding-x-sm-mobile,
-			padding-top: $btn-padding-y-sm-mobile,
+			font-size:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, mobile, font-size),
+					null
+				),
+			padding-bottom:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, mobile, padding-bottom),
+					null
+				),
+			padding-left:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, mobile, padding-left),
+					null
+				),
+			padding-right:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, mobile, padding-right),
+					null
+				),
+			padding-top:
+				if(
+					variable-exists(btn-sm),
+					map-deep-get($btn-sm, mobile, padding-top),
+					null
+				),
 		),
 	),
 	$input-group-sm-item-btn
@@ -1709,16 +1857,56 @@ $input-group-sm-item-btn: map-deep-merge(
 $input-group-sm-item-btn-monospaced: () !default;
 $input-group-sm-item-btn-monospaced: map-deep-merge(
 	(
-		height: $btn-monospaced-size-sm,
+		height:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, height),
+				1.9375rem
+			),
 		line-height: 1,
-		padding-bottom: $btn-monospaced-padding-y-sm,
-		padding-left: $btn-monospaced-padding-x-sm,
-		padding-right: $btn-monospaced-padding-x-sm,
-		padding-top: $btn-monospaced-padding-y-sm,
-		width: $btn-monospaced-size-sm,
+		padding-bottom:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, padding-bottom),
+				null
+			),
+		padding-left:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, padding-left),
+				null
+			),
+		padding-right:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, padding-right),
+				null
+			),
+		padding-top:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, padding-top),
+				null
+			),
+		width:
+			if(
+				variable-exists(btn-monospaced-sm),
+				map-get($btn-monospaced-sm, width),
+				1.9375rem
+			),
 		mobile: (
-			height: $btn-monospaced-size-sm-mobile,
-			width: $btn-monospaced-size-sm-mobile,
+			height:
+				if(
+					variable-exists(btn-monospaced-sm),
+					map-deep-get($btn-monospaced-sm, mobile, height),
+					null
+				),
+			width:
+				if(
+					variable-exists(btn-monospaced-sm),
+					map-deep-get($btn-monospaced-sm, mobile, width),
+					null
+				),
 		),
 	),
 	$input-group-sm-item-btn-monospaced
diff --git a/packages/clay-css/src/scss/variables/_labels.scss b/packages/clay-css/src/scss/variables/_labels.scss
index fdf3438a27..4ca143cd8c 100644
--- a/packages/clay-css/src/scss/variables/_labels.scss
+++ b/packages/clay-css/src/scss/variables/_labels.scss
@@ -142,7 +142,7 @@ $label-close: map-deep-merge(
 			opacity: 1,
 		),
 		disabled: (
-			opacity: $btn-disabled-opacity,
+			opacity: $component-disabled-opacity,
 		),
 	),
 	$label-close
diff --git a/packages/clay-css/src/scss/variables/_links.scss b/packages/clay-css/src/scss/variables/_links.scss
index a5d3223034..2fb35399cf 100644
--- a/packages/clay-css/src/scss/variables/_links.scss
+++ b/packages/clay-css/src/scss/variables/_links.scss
@@ -41,15 +41,27 @@ $link-secondary: map-deep-merge(
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-border-radius: $btn-border-radius !default;
+$link-outline-border-radius: if(
+	variable-exists(btn-border-radius),
+	$btn-border-radius,
+	$border-radius
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-border-width: $btn-border-width !default;
+$link-outline-border-width: if(
+	variable-exists(btn-border-width),
+	$btn-border-width,
+	$border-width
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-font-size: $btn-font-size-sm !default;
+$link-outline-font-size: if(
+	variable-exists(btn-font-size-sm),
+	$btn-font-size-sm,
+	$font-size-sm
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
@@ -57,19 +69,31 @@ $link-outline-font-weight: $font-weight-semi-bold !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-line-height: $btn-line-height-sm !default;
+$link-outline-line-height: if(
+	variable-exists(btn-line-height-sm),
+	$btn-line-height-sm,
+	$line-height-sm
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-padding-x: $btn-padding-x-sm !default;
+$link-outline-padding-x: if(
+	variable-exists(btn-padding-x-sm),
+	$btn-padding-x-sm,
+	0.5rem
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-padding-y: $btn-padding-y-sm !default;
+$link-outline-padding-y: if(
+	variable-exists(btn-padding-x-sm),
+	$btn-padding-y-sm,
+	0.25rem
+) !default;
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-outline` instead
 
-$link-outline-transition: $btn-transition !default;
+$link-outline-transition: $component-transition !default;
 
 $link-outline: () !default;
 $link-outline: map-deep-merge(
@@ -127,8 +151,8 @@ $link-outline-primary: map-deep-merge(
 		disabled: (
 			background-color: transparent,
 			color: $primary,
-			cursor: $btn-disabled-cursor,
-			opacity: $btn-disabled-opacity,
+			cursor: $disabled-cursor,
+			opacity: $component-disabled-opacity,
 		),
 	),
 	$link-outline-primary
@@ -150,8 +174,8 @@ $link-outline-secondary: map-deep-merge(
 		disabled: (
 			background-color: transparent,
 			color: $secondary,
-			cursor: $btn-disabled-cursor,
-			opacity: $btn-disabled-opacity,
+			cursor: $disabled-cursor,
+			opacity: $component-disabled-opacity,
 		),
 	),
 	$link-outline-secondary
@@ -161,7 +185,11 @@ $link-outline-secondary: map-deep-merge(
 
 /// @deprecated as of v3.4.0 use the Sass map `$link-monospaced` instead
 
-$link-monospaced-size: $btn-monospaced-size-sm !default;
+$link-monospaced-size: if(
+	variable-exists(btn-monospaced-size-sm),
+	$btn-monospaced-size-sm,
+	1.9375rem
+) !default;
 
 $link-monospaced: () !default;
 $link-monospaced: map-deep-merge(
@@ -272,7 +300,7 @@ $component-action: map-deep-merge(
 		justify-content: center,
 		overflow: hidden,
 		padding: 0,
-		transition: $btn-transition,
+		transition: $component-transition,
 		vertical-align: middle,
 		width: map-get($link-monospaced, width),
 		hover: (
@@ -292,7 +320,7 @@ $component-action: map-deep-merge(
 			box-shadow: none,
 			color: $secondary,
 			cursor: $disabled-cursor,
-			opacity: $btn-disabled-opacity,
+			opacity: $component-disabled-opacity,
 			active: (
 				pointer-events: none,
 			),
diff --git a/packages/clay-css/src/scss/variables/_multi-step-nav.scss b/packages/clay-css/src/scss/variables/_multi-step-nav.scss
index d0e0672c3e..f9d34aefec 100644
--- a/packages/clay-css/src/scss/variables/_multi-step-nav.scss
+++ b/packages/clay-css/src/scss/variables/_multi-step-nav.scss
@@ -23,7 +23,7 @@ $multi-step-icon-hover-color: rgba($black, 0.7) !default;
 $multi-step-icon-hover-text-decoration: none !default;
 
 $multi-step-icon-focus-bg: $multi-step-icon-hover-bg !default;
-$multi-step-icon-focus-box-shadow: $btn-focus-box-shadow !default;
+$multi-step-icon-focus-box-shadow: $component-focus-box-shadow !default;
 $multi-step-icon-focus-color: $multi-step-icon-hover-color !default;
 $multi-step-icon-focus-outline: 0 !default;
 $multi-step-icon-focus-text-decoration: $multi-step-icon-hover-text-decoration !default;
diff --git a/packages/clay-css/src/scss/variables/_navbar.scss b/packages/clay-css/src/scss/variables/_navbar.scss
index d3a27e35bc..1dc1b5f92e 100644
--- a/packages/clay-css/src/scss/variables/_navbar.scss
+++ b/packages/clay-css/src/scss/variables/_navbar.scss
@@ -32,7 +32,7 @@ $navbar-brand-padding-y: calc(
 
 // Navbar Toggler
 
-$navbar-toggler-border-radius: $btn-border-radius !default;
+$navbar-toggler-border-radius: $border-radius !default;
 $navbar-toggler-cursor: null !default;
 $navbar-toggler-font-size: $font-size-lg !default;
 $navbar-toggler-padding-x: 0.75rem !default;
diff --git a/packages/clay-css/src/scss/variables/_navs.scss b/packages/clay-css/src/scss/variables/_navs.scss
index df8511d1d4..f9483f0a80 100644
--- a/packages/clay-css/src/scss/variables/_navs.scss
+++ b/packages/clay-css/src/scss/variables/_navs.scss
@@ -68,7 +68,7 @@ $nav-btn-margin-y: calc(
 
 /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
 
-$nav-btn-padding-x: $btn-padding-x-sm !default;
+$nav-btn-padding-x: 0.5rem !default;
 
 /// @deprecated after v3.4.0 use the Sass map `$nav-btn` instead
 
@@ -98,7 +98,14 @@ $nav-btn: map-deep-merge(
 			margin-bottom: 0,
 			margin-left: math-sign($nav-btn-padding-x),
 			margin-right: math-sign($nav-btn-padding-x),
-			margin-top: math-sign($btn-border-width),
+			margin-top:
+				math-sign(
+					if(
+						variable-exists(btn-border-width),
+						$btn-border-width,
+						$border-width
+					)
+				),
 		),
 		btn-link: (
 			margin-left: 0,
@@ -118,8 +125,22 @@ $nav-btn-monospaced: map-deep-merge(
 	(
 		padding: 0,
 		c-inner: (
-			margin-left: math-sign($btn-border-width),
-			margin-right: math-sign($btn-border-width),
+			margin-left:
+				math-sign(
+					if(
+						variable-exists(btn-border-width),
+						$btn-border-width,
+						$border-width
+					)
+				),
+			margin-right:
+				math-sign(
+					if(
+						variable-exists(btn-border-width),
+						$btn-border-width,
+						$border-width
+					)
+				),
 		),
 	),
 	$nav-btn-monospaced
diff --git a/packages/clay-css/src/scss/variables/_tables.scss b/packages/clay-css/src/scss/variables/_tables.scss
index ff543a6894..26afa85024 100644
--- a/packages/clay-css/src/scss/variables/_tables.scss
+++ b/packages/clay-css/src/scss/variables/_tables.scss
@@ -207,7 +207,12 @@ $table-action-link: () !default;
 $table-action-link: map-deep-merge(
 	(
 		align-items: center,
-		border-radius: $btn-border-radius,
+		border-radius:
+			if(
+				variable-exists(btn-border-radius),
+				$btn-border-radius,
+				$border-radius
+			),
 		display: inline-flex,
 		height: 2rem,
 		justify-content: center,
diff --git a/packages/clay-css/src/scss/variables/_tbar.scss b/packages/clay-css/src/scss/variables/_tbar.scss
index 6df218764c..7647d9dba4 100644
--- a/packages/clay-css/src/scss/variables/_tbar.scss
+++ b/packages/clay-css/src/scss/variables/_tbar.scss
@@ -326,7 +326,7 @@ $subnav-tbar-primary-component-link: map-deep-merge(
 		hover-color: $gray-900,
 		disabled-color: $gray-600,
 		disabled-cursor: $disabled-cursor,
-		disabled-opacity: $btn-disabled-opacity,
+		disabled-opacity: $component-disabled-opacity,
 		disabled-text-decoration: none,
 	),
 	$subnav-tbar-primary-component-link
@@ -337,7 +337,7 @@ $subnav-tbar-primary-component-label-close: map-deep-merge(
 	(
 		focus-color: inherit,
 		disabled-color: $gray-600,
-		disabled-opacity: $btn-disabled-opacity,
+		disabled-opacity: $component-disabled-opacity,
 	),
 	$subnav-tbar-primary-component-label-close
 );
diff --git a/packages/clay-css/src/scss/variables/_time.scss b/packages/clay-css/src/scss/variables/_time.scss
index 5efdd61da1..6fcc555832 100644
--- a/packages/clay-css/src/scss/variables/_time.scss
+++ b/packages/clay-css/src/scss/variables/_time.scss
@@ -89,7 +89,12 @@ $clay-time-inner-spin: map-deep-merge(
 		border-color: $secondary-d1,
 		border-radius: 8px,
 		border-style: solid,
-		border-width: $btn-border-width,
+		border-width:
+			if(
+				variable-exists(btn-border-width),
+				$btn-border-width,
+				$border-width
+			),
 	),
 	$clay-time-inner-spin
 );