diff --git a/src/components/AlertBanner/stylesBuilder/stylesBuilder.ts b/src/components/AlertBanner/stylesBuilder/stylesBuilder.ts
index fee0b467..7e59881c 100644
--- a/src/components/AlertBanner/stylesBuilder/stylesBuilder.ts
+++ b/src/components/AlertBanner/stylesBuilder/stylesBuilder.ts
@@ -11,7 +11,7 @@ type AlertBannerStylesBuilder = {
   container: BaseProps;
   iconContainer: BaseProps;
   actionContainer: BaseProps;
-  closeButton: BaseProps;
+  closeButton: BaseProps<'appearance'>;
   actionProps: Partial<BareButtonProps>;
   closeButtonProps: Partial<GhostIconButtonProps>;
 };
diff --git a/src/components/Avatar/Avatar.styles.ts b/src/components/Avatar/Avatar.styles.ts
index d4b802c8..8d5e5bb9 100644
--- a/src/components/Avatar/Avatar.styles.ts
+++ b/src/components/Avatar/Avatar.styles.ts
@@ -25,7 +25,7 @@ export type AvatarConfig = {
   innerElements?: {
     image?: BaseProps;
   };
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export const defaultConfig = {
   overflow: 'hidden',
diff --git a/src/components/Badge/Badge.styles.ts b/src/components/Badge/Badge.styles.ts
index e821e272..549e3265 100644
--- a/src/components/Badge/Badge.styles.ts
+++ b/src/components/Badge/Badge.styles.ts
@@ -21,7 +21,7 @@ export type BadgeConfig = {
     label?: BaseProps;
     iconContainer?: BaseProps;
   };
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export const defaultConfig = {
   display: 'flex',
diff --git a/src/components/Button/Button.styles.ts b/src/components/Button/Button.styles.ts
index 9c04ef19..cbbbfb52 100644
--- a/src/components/Button/Button.styles.ts
+++ b/src/components/Button/Button.styles.ts
@@ -74,7 +74,7 @@ export type DefaultButtonConfig = {
       };
     };
   };
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export type GhostButtonConfig = {
   appearance?: {
@@ -154,7 +154,7 @@ export type GhostButtonConfig = {
       };
     };
   };
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export type BareButtonConfig = {
   appearance?: {
@@ -229,7 +229,7 @@ export type BareButtonConfig = {
       };
     };
   };
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 const size = {
   small: {
diff --git a/src/components/Counter/Counter.styles.ts b/src/components/Counter/Counter.styles.ts
index b643885b..73361016 100644
--- a/src/components/Counter/Counter.styles.ts
+++ b/src/components/Counter/Counter.styles.ts
@@ -12,7 +12,7 @@ export type CounterConfig = {
       }
     >
   >;
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export const defaultConfig = {
   display: 'inline-flex',
diff --git a/src/components/InlineBanner/stylesBuilder/stylesBuilder.ts b/src/components/InlineBanner/stylesBuilder/stylesBuilder.ts
index d7d9484a..c07a5f04 100644
--- a/src/components/InlineBanner/stylesBuilder/stylesBuilder.ts
+++ b/src/components/InlineBanner/stylesBuilder/stylesBuilder.ts
@@ -18,7 +18,7 @@ type InlineBannerStylesBuilder = {
   actionContainer: BaseProps;
   description: BaseProps;
   title: BaseProps;
-  closeButton: BaseProps;
+  closeButton: BaseProps<'appearance'>;
 };
 
 export const stylesBuilder = ({
diff --git a/src/components/Label/stylesBuilder/stylesBuilder.ts b/src/components/Label/stylesBuilder/stylesBuilder.ts
index 29878b19..7bfd89b8 100644
--- a/src/components/Label/stylesBuilder/stylesBuilder.ts
+++ b/src/components/Label/stylesBuilder/stylesBuilder.ts
@@ -8,7 +8,7 @@ type LabelStylesBuilder = {
   label: BaseProps;
   optional: BaseProps;
   tooltip: BaseProps;
-  action: BaseProps;
+  action: BaseProps<'appearance'>;
 };
 
 export const stylesBuilder = (
diff --git a/src/components/Loader/Loader.styles.ts b/src/components/Loader/Loader.styles.ts
index 4954e3fc..1a229069 100644
--- a/src/components/Loader/Loader.styles.ts
+++ b/src/components/Loader/Loader.styles.ts
@@ -6,8 +6,8 @@ import type { LoaderAppearance, LoaderShape, LoaderSize } from './types';
 import { Theme } from '@/theme';
 import { BaseProps } from '@/types/BaseProps';
 
-export type SVGProps = Omit<
-  BaseProps,
+export type SVGProps = BaseProps<
+  | 'appearance'
   | 'opacity'
   | 'display'
   | 'order'
diff --git a/src/components/SocialButton/SocialButton.styles.ts b/src/components/SocialButton/SocialButton.styles.ts
index 543cadd1..d5e167cd 100644
--- a/src/components/SocialButton/SocialButton.styles.ts
+++ b/src/components/SocialButton/SocialButton.styles.ts
@@ -2,7 +2,7 @@ import { BaseProps } from '@/types/BaseProps';
 
 export type SocialButtonAppearance = 'primary' | 'secondary';
 
-export type SocialButtonConfig = BaseProps & {
+export type SocialButtonConfig = BaseProps<'appearance'> & {
   appearance?: Partial<Record<SocialButtonAppearance, BaseProps>>;
 };
 
diff --git a/src/components/StatusDot/StatusDot.styles.ts b/src/components/StatusDot/StatusDot.styles.ts
index e0e22660..95fc7433 100644
--- a/src/components/StatusDot/StatusDot.styles.ts
+++ b/src/components/StatusDot/StatusDot.styles.ts
@@ -5,7 +5,7 @@ import type { BaseProps } from '@/types/BaseProps';
 export type StatusDotConfig = {
   appearance?: Partial<Record<StatusDotAppearance, BaseProps>>;
   hasStroke?: BaseProps;
-} & BaseProps;
+} & BaseProps<'appearance'>;
 
 export const defaultConfig = {
   w: '12px',
diff --git a/src/components/Tag/stylesBuilder/stylesBuilder.ts b/src/components/Tag/stylesBuilder/stylesBuilder.ts
index 117b5c6c..c5c06d78 100644
--- a/src/components/Tag/stylesBuilder/stylesBuilder.ts
+++ b/src/components/Tag/stylesBuilder/stylesBuilder.ts
@@ -7,8 +7,8 @@ import type { BaseProps } from '@/types/BaseProps';
 type TagStylesBuilder = {
   container: BaseProps;
   label: BaseProps;
-  avatar: BaseProps;
-  closeButton: BaseProps;
+  avatar: BaseProps<'appearance'>;
+  closeButton: BaseProps<'appearance'>;
 };
 export const stylesBuilder = (
   custom: TagProps['custom'],
diff --git a/src/components/TextInput/stylesBuilder/stylesBuilder.ts b/src/components/TextInput/stylesBuilder/stylesBuilder.ts
index 567ca737..26621309 100644
--- a/src/components/TextInput/stylesBuilder/stylesBuilder.ts
+++ b/src/components/TextInput/stylesBuilder/stylesBuilder.ts
@@ -8,7 +8,7 @@ type TextInputStylesBuilder = {
   input: BaseProps;
   icon: BaseProps;
   text: BaseProps;
-  clearButton: BaseProps;
+  clearButton: BaseProps<'appearance'>;
   beforeComponent: BaseProps;
   afterComponent: BaseProps;
 };
diff --git a/src/components/Toast/stylesBuilder/stylesBuilder.ts b/src/components/Toast/stylesBuilder/stylesBuilder.ts
index a6251daf..148c830a 100644
--- a/src/components/Toast/stylesBuilder/stylesBuilder.ts
+++ b/src/components/Toast/stylesBuilder/stylesBuilder.ts
@@ -12,7 +12,7 @@ type StylesBuilderProps = Required<Pick<ToastProps, 'emphasis' | 'intent'>> & {
 type ToastStylesBuilder = {
   container: BaseProps;
   actionContainer: BaseProps;
-  closeButton: BaseProps;
+  closeButton: BaseProps<'appearance'>;
   iconContainer: BaseProps;
   middleDot: BaseProps;
 };
diff --git a/src/types/BaseProps.ts b/src/types/BaseProps.ts
index 5b7ad733..f2f7481e 100644
--- a/src/types/BaseProps.ts
+++ b/src/types/BaseProps.ts
@@ -2,4 +2,15 @@ import { SystemProps } from '@xstyled/styled-components';
 
 import { Theme } from '@/theme';
 
-export type BaseProps = Omit<SystemProps<Theme>, 'appearance'>;
+type TetrislySystemProps = SystemProps<Theme>;
+
+/**
+ * A utility type that allows you to pick all style properties from a TetrislySystemProps type except for a specified set of keys.
+ * @template K - The union of keys to exclude from the resulting type, for instance 'appearance' | 'size' | 'background.
+ * @template TetrislySystemProps - The type to pick properties from.
+ * @returns A new type that includes all properties from `TetrislySystemProps` except for those specified in `K`.
+ */
+export type BaseProps<K extends keyof TetrislySystemProps = never> = Pick<
+  TetrislySystemProps,
+  Exclude<keyof TetrislySystemProps, K>
+>;