diff --git a/core/package.json b/core/package.json
index 4734f41..c388af1 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@react-native-material/core",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "description": "Modular and customizable Material Design UI components for React Native",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
diff --git a/core/src/base/IconComponentContext.tsx b/core/src/base/IconComponentContext.tsx
index d4a5d00..8c2ccec 100644
--- a/core/src/base/IconComponentContext.tsx
+++ b/core/src/base/IconComponentContext.tsx
@@ -1,4 +1,5 @@
 import React, { createContext, useContext } from "react";
+import { Color, usePaletteColor } from "../hooks/use-palette-color";
 
 export type IconComponent = React.ComponentType<IconProps>;
 
@@ -19,15 +20,16 @@ export interface IconProps {
 
   size?: number;
 
-  color?: string;
+  color?: Color;
 
   [key: string]: any;
 }
 
-export const Icon: React.FC<IconProps> = props => {
+export const Icon: React.FC<IconProps> = ({ color = "on-background", ...rest }) => {
   const IconComponent = useIconComponent();
   if (!IconComponent) {
     throw new Error("`IconComponent` is undefined. Seems like you forgot to wrap your component with `Provider`.");
   }
-  return <IconComponent {...props} />;
+  const { main } = usePaletteColor(color);
+  return <IconComponent {...rest} color={main} />;
 };