diff --git a/docs/docs/Toaster.md b/docs/docs/Toaster.md
index 301bbef..85ae025 100644
--- a/docs/docs/Toaster.md
+++ b/docs/docs/Toaster.md
@@ -73,19 +73,20 @@ import { ZView } from 'react-native-z-view';
 
 ## API Reference
 
-| Property                 |                                            Description                                             |                     Default |
-| :----------------------- | :------------------------------------------------------------------------------------------------: | --------------------------: |
-| theme                    |                                          `light`, `dark`                                           |                     `light` |
-| visibleToasts            |                                  Maximum number of visible toasts                                  |                         `3` |
-| position                 |                              Place where the toasts will be rendered                               |                `top-center` |
-| offset                   |                                   Offset from the top or bottom                                    |                         `0` |
-| closeButton              |                                 Adds a close button to all toasts                                  |                     `false` |
-| invert                   |                             Dark toasts in light mode and vice versa.                              |                     `false` |
-| toastOptions             | These will act as default options for all toasts. See [toast()](/toast) for all available options. |                        `{}` |
-| gap                      |                                  Gap between toasts when expanded                                  |                        `16` |
-| icons                    |                                     Changes the default icons                                      |                         `-` |
-| pauseWhenPageIsHidden    |                        Pauses toast timers when the app enters background.                         |                        `{}` |
+| Property                  |                                            Description                                             |                     Default |
+| :------------------------ | :------------------------------------------------------------------------------------------------: | --------------------------: |
+| theme                     |                                          `light`, `dark`                                           |                     `light` |
+| visibleToasts             |                                  Maximum number of visible toasts                                  |                         `3` |
+| position                  |                              Place where the toasts will be rendered                               |                `top-center` |
+| offset                    |                                   Offset from the top or bottom                                    |                         `0` |
+| closeButton               |                                 Adds a close button to all toasts                                  |                     `false` |
+| invert                    |                             Dark toasts in light mode and vice versa.                              |                     `false` |
+| toastOptions              | These will act as default options for all toasts. See [toast()](/toast) for all available options. |                        `{}` |
+| gap                       |                                  Gap between toasts when expanded                                  |                        `16` |
+| icons                     |                                     Changes the default icons                                      |                         `-` |
+| pauseWhenPageIsHidden     |                        Pauses toast timers when the app enters background.                         |                        `{}` |
 | `swipeToDismissDirection` |                             Swipe direction to dismiss (`left`, `up`).                             |                        `up` |
-| cn                       |                         Custom function for constructing/merging classes.                          | `filter(Boolean).join(' ')` |
-|  ToasterOverlayWrapper   |                                Custom component to wrap the Toaster.                               |                       `div` |
-|  autoWiggleOnUpdate      |             Adds a wiggle animation on toast update. `never`, `toast-change`, `always`             |                     `never` |
+| cn                        |                         Custom function for constructing/merging classes.                          | `filter(Boolean).join(' ')` |
+| ToasterOverlayWrapper     |                                Custom component to wrap the Toaster.                               |                       `div` |
+| autoWiggleOnUpdate        |             Adds a wiggle animation on toast update. `never`, `toast-change`, `always`             |                     `never` |
+| richColors                |                             Makes error and success state more colorful                            |                     `false` |
diff --git a/docs/docs/sonner.md b/docs/docs/sonner.md
index 8564f87..b67e95d 100644
--- a/docs/docs/sonner.md
+++ b/docs/docs/sonner.md
@@ -29,24 +29,24 @@
 
 ## Toaster:
 
-| Property                 | Sonner Native | Sonner Web |
-| :----------------------- | ------------- | ---------- |
-| theme                    | ✅            | ✅         |
-| visibleToasts            | ✅            | ✅         |
-| position                 | ✅            | ✅         |
-| closeButton              | ✅            | ✅         |
-| invert                   | ✅            | ✅         |
-| toastOptions             | ✅            | ✅         |
-| gap                      | ✅            | ✅         |
-| icons                    | ✅            | ✅         |
+| Property                  | Sonner Native | Sonner Web |
+| :------------------------ | ------------- | ---------- |
+| theme                     | ✅            | ✅         |
+| visibleToasts             | ✅            | ✅         |
+| position                  | ✅            | ✅         |
+| closeButton               | ✅            | ✅         |
+| invert                    | ✅            | ✅         |
+| toastOptions              | ✅            | ✅         |
+| gap                       | ✅            | ✅         |
+| icons                     | ✅            | ✅         |
 | `swipeToDismissDirection` | ✅            | ❌         |
-| dir                      | ❌            | ✅         |
-| richColors               | ❌            | ✅         |
-| expand                   | 🕸️            | ✅         |
-| offset                   | ✅            | ✅         |
-| hotkey                   | 🕸️            | ✅         |
-| loadingIcon              | ✅            | ✅         |
-| pauseWhenPageIsHidden    | ✅            | ✅         |
-| cn                       | ✅            | ✅         |
+| dir                       | ❌            | ✅         |
+| richColors                | ✅            | ✅         |
+| expand                    | 🕸️            | ✅         |
+| offset                    | ✅            | ✅         |
+| hotkey                    | 🕸️            | ✅         |
+| loadingIcon               | ✅            | ✅         |
+| pauseWhenPageIsHidden     | ✅            | ✅         |
+| cn                        | ✅            | ✅         |
 
 **🕸️: Not applicable for native apps.**
diff --git a/docs/docs/toast.md b/docs/docs/toast.md
index f1fc24c..bcf62f0 100644
--- a/docs/docs/toast.md
+++ b/docs/docs/toast.md
@@ -223,6 +223,7 @@ Toasts can also be automatically wiggled by passing the `autoWiggleOnUpdate` pro
 | actionButtonTextStyles |                                   Styles for the action button text                                    |         `{}` |
 | cancelButtonStyles     |                                      Styles for the cancel button                                      |         `{}` |
 | cancelButtonTextStyles |                                   Styles for the cancel button text                                    |         `{}` |
+| richColors             |                               Makes error and success state more colorful                              |      `false` |
 
 ```
 
diff --git a/example/src/ToastDemo.tsx b/example/src/ToastDemo.tsx
index 3be94c1..afd7d7e 100644
--- a/example/src/ToastDemo.tsx
+++ b/example/src/ToastDemo.tsx
@@ -42,6 +42,15 @@ export const ToastDemo: React.FC = () => {
           });
         }}
       />
+      <Button
+        title="Rich colors"
+        onPress={() => {
+          toast.warning('Rich colors', {
+            description: 'Your changes have been saved successfully',
+            richColors: true,
+          });
+        }}
+      />
       <Button
         title="Show toast with description and action"
         onPress={() => {
diff --git a/src/constants.ts b/src/constants.ts
index 2bb7b27..8c1b698 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -22,6 +22,7 @@ export const toastDefaultValues: {
   gap: number;
   theme: ToastTheme;
   autoWiggleOnUpdate: AutoWiggle;
+  richColors: boolean;
 } = {
   duration: 4000,
   position: 'top-center',
@@ -38,4 +39,5 @@ export const toastDefaultValues: {
   gap: 14,
   theme: 'system',
   autoWiggleOnUpdate: 'never',
+  richColors: false,
 };
diff --git a/src/toast.tsx b/src/toast.tsx
index e48e0fa..4f84edf 100644
--- a/src/toast.tsx
+++ b/src/toast.tsx
@@ -13,7 +13,6 @@ import { ToastSwipeHandler } from './gestures';
 import { CircleCheck, CircleX, Info, TriangleAlert, X } from './icons';
 import { isToastAction, type ToastProps, type ToastRef } from './types';
 import { useAppStateListener } from './use-app-state';
-import { useColors } from './use-colors';
 import { useDefaultStyles } from './use-default-styles';
 
 export const Toast = React.forwardRef<ToastRef, ToastProps>(
@@ -49,7 +48,7 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
       unstyled: unstyledProps,
       important,
       invert: invertProps,
-      // richColors: richColorsProps,
+      richColors: richColorsProps,
     },
     ref
   ) => {
@@ -61,7 +60,7 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
       pauseWhenPageIsHidden,
       cn,
       invert: invertCtx,
-      // richColors: richColorsCtx,
+      richColors: richColorsCtx,
       toastOptions: {
         unstyled: unstyledCtx,
         toastContainerStyle: toastContainerStyleCtx,
@@ -80,12 +79,11 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
       },
     } = useToastContext();
     const invert = invertProps ?? invertCtx;
-    // const richColors = richColorsProps ?? richColorsCtx;
+    const richColors = richColorsProps ?? richColorsCtx;
     const unstyled = unstyledProps ?? unstyledCtx;
     const duration = durationProps ?? durationCtx;
     const closeButton = closeButtonProps ?? closeButtonCtx;
 
-    const colors = useColors(invert);
     const { entering, exiting } = useToastLayoutAnimations(position);
 
     const isDragging = React.useRef(false);
@@ -256,9 +254,10 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
 
     const defaultStyles = useDefaultStyles({
       invert,
-      // richColors,
+      richColors,
       unstyled,
       description,
+      variant,
     });
 
     if (jsx) {
@@ -329,7 +328,11 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
             ) : variant in icons ? (
               icons[variant]
             ) : (
-              <ToastIcon variant={variant} invert={invert} />
+              <ToastIcon
+                variant={variant}
+                invert={invert}
+                richColors={richColors}
+              />
             )}
             <View style={{ flex: 1 }}>
               <Text
@@ -430,7 +433,7 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
               >
                 <X
                   size={20}
-                  color={colors['text-secondary']}
+                  color={defaultStyles.closeButtonColor}
                   style={[closeButtonIconStyleCtx, styles?.closeButtonIcon]}
                   className={cn(
                     classNamesCtx?.closeButtonIcon,
@@ -448,21 +451,30 @@ export const Toast = React.forwardRef<ToastRef, ToastProps>(
 
 Toast.displayName = 'Toast';
 
-export const ToastIcon: React.FC<Pick<ToastProps, 'variant' | 'invert'>> = ({
-  variant,
-  invert,
-}) => {
-  const colors = useColors(invert);
+export const ToastIcon: React.FC<
+  Pick<ToastProps, 'variant'> & {
+    invert: boolean;
+    richColors: boolean;
+  }
+> = ({ variant, invert, richColors }) => {
+  const color = useDefaultStyles({
+    variant,
+    invert,
+    richColors,
+    unstyled: false,
+    description: undefined,
+  }).iconColor;
+
   switch (variant) {
     case 'success':
-      return <CircleCheck size={20} color={colors.success} />;
+      return <CircleCheck size={20} color={color} />;
     case 'error':
-      return <CircleX size={20} color={colors.error} />;
+      return <CircleX size={20} color={color} />;
     case 'warning':
-      return <TriangleAlert size={20} color={colors.warning} />;
+      return <TriangleAlert size={20} color={color} />;
     default:
     case 'info':
-      return <Info size={20} color={colors.info} />;
+      return <Info size={20} color={color} />;
   }
 };
 
diff --git a/src/toaster.tsx b/src/toaster.tsx
index cb9eeb5..8b6ca0b 100644
--- a/src/toaster.tsx
+++ b/src/toaster.tsx
@@ -55,6 +55,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
   gap,
   theme,
   autoWiggleOnUpdate,
+  richColors,
   ...props
 }) => {
   const [toasts, setToasts] = React.useState<ToastProps[]>([]);
@@ -198,6 +199,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
       toastOptions,
       autoWiggleOnUpdate:
         autoWiggleOnUpdate ?? toastDefaultValues.autoWiggleOnUpdate,
+      richColors: richColors ?? toastDefaultValues.richColors,
     }),
     [
       duration,
@@ -214,6 +216,7 @@ export const ToasterUI: React.FC<ToasterProps> = ({
       theme,
       toastOptions,
       autoWiggleOnUpdate,
+      richColors,
     ]
   );
 
diff --git a/src/types.ts b/src/types.ts
index e0911eb..a1627f5 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -63,6 +63,7 @@ export type ToastProps = StyleProps & {
   icon?: React.ReactNode;
   action?: ToastAction | React.ReactNode;
   cancel?: ToastAction | React.ReactNode;
+  richColors?: boolean;
   onDismiss?: (id: string | number) => void;
   onAutoClose?: (id: string | number) => void;
   promiseOptions?: PromiseOptions;
@@ -128,6 +129,7 @@ export type ToasterProps = {
   };
   gap?: number;
   loadingIcon?: React.ReactNode;
+  richColors?: boolean;
   // pauseWhenPageIsHidden?: boolean; (false)
   icons?: {
     success?: React.ReactNode;
@@ -162,6 +164,7 @@ export type ToasterContextType = Required<
     | 'theme'
     | 'toastOptions'
     | 'autoWiggleOnUpdate'
+    | 'richColors'
   >
 > & {
   addToast: AddToastContextHandler;
diff --git a/src/use-colors.ts b/src/use-colors.ts
index c0ba19b..6979383 100644
--- a/src/use-colors.ts
+++ b/src/use-colors.ts
@@ -12,6 +12,29 @@ const light = {
   'error': '#ff3a41',
   'warning': '#e37a00',
   'info': '#286efa',
+
+  'rich': {
+    success: {
+      background: '#ecfdf3',
+      foreground: '#008a2e',
+      border: '#d3fde5',
+    },
+    error: {
+      background: '#fff0f0',
+      foreground: '#e60000',
+      border: '#ffe0e1',
+    },
+    warning: {
+      background: '#fffcf0',
+      foreground: '#dc7609',
+      border: '#fdf5d3',
+    },
+    info: {
+      background: '#f0f8ff',
+      foreground: '#0973dc',
+      border: '#d3e0fd',
+    },
+  },
 };
 
 const dark: typeof light = {
@@ -25,6 +48,29 @@ const dark: typeof light = {
   'error': '#FF999D',
   'warning': '#ffd089',
   'info': '#B3CDFF',
+
+  'rich': {
+    success: {
+      background: '#001f0f',
+      foreground: '#59f3a6',
+      border: '#003d1c',
+    },
+    error: {
+      background: '#2d0607',
+      foreground: '#ff9ea1',
+      border: '#4d0408',
+    },
+    warning: {
+      background: '#1d1f00',
+      foreground: '#f3cf58',
+      border: '#3d3d00',
+    },
+    info: {
+      background: '#000d1f',
+      foreground: '#5896f3',
+      border: '#00113d',
+    },
+  },
 };
 
 export const useColors = (invertProps?: boolean) => {
diff --git a/src/use-default-styles.ts b/src/use-default-styles.ts
index a356e79..bd36f23 100644
--- a/src/use-default-styles.ts
+++ b/src/use-default-styles.ts
@@ -1,5 +1,6 @@
 import type { TextStyle, ViewStyle } from 'react-native';
 import { useColors } from './use-colors';
+import type { ToastVariant } from './types';
 
 type DefaultStyles = {
   toast: ViewStyle;
@@ -11,20 +12,25 @@ type DefaultStyles = {
   actionButtonText: TextStyle;
   cancelButton: ViewStyle;
   cancelButtonText: TextStyle;
+  closeButtonColor: string;
+  iconColor: string;
 };
 
 export const useDefaultStyles = ({
   invert,
-  // richColors,
+  richColors,
   unstyled,
   description,
+  variant: variantProps,
 }: {
   invert: boolean;
-  // richColors: boolean;
+  richColors: boolean;
   unstyled: boolean | undefined;
   description: string | undefined;
+  variant: ToastVariant;
 }): DefaultStyles => {
   const colors = useColors(invert);
+  const variant = variantProps === 'loading' ? 'info' : variantProps;
 
   if (unstyled) {
     return {
@@ -37,6 +43,8 @@ export const useDefaultStyles = ({
       actionButtonText: {},
       cancelButton: {},
       cancelButtonText: {},
+      closeButtonColor: colors['text-secondary'],
+      iconColor: colors[variant],
     };
   }
 
@@ -46,8 +54,12 @@ export const useDefaultStyles = ({
       padding: 16,
       borderRadius: 16,
       marginHorizontal: 16,
-      backgroundColor: colors['background-primary'],
+      backgroundColor: richColors
+        ? colors.rich[variant].background
+        : colors['background-primary'],
       borderCurve: 'continuous',
+      borderWidth: richColors ? 1 : undefined,
+      borderColor: richColors ? colors.rich[variant].border : undefined,
     },
     toastContent: {
       flexDirection: 'row',
@@ -57,13 +69,17 @@ export const useDefaultStyles = ({
     title: {
       fontWeight: '600',
       lineHeight: 20,
-      color: colors['text-primary'],
+      color: richColors
+        ? colors.rich[variant].foreground
+        : colors['text-primary'],
     },
     description: {
       fontSize: 14,
       lineHeight: 20,
       marginTop: 2,
-      color: colors['text-tertiary'],
+      color: richColors
+        ? colors.rich[variant].foreground
+        : colors['text-tertiary'],
     },
     buttons: {
       flexDirection: 'row',
@@ -99,5 +115,9 @@ export const useDefaultStyles = ({
       alignSelf: 'flex-start',
       color: colors['text-secondary'],
     },
+    iconColor: richColors ? colors.rich[variant].foreground : colors[variant],
+    closeButtonColor: richColors
+      ? colors.rich[variant].foreground
+      : colors['text-secondary'],
   };
 };