diff --git a/example/components/assets/styles/variables.ts b/example/components/assets/styles/variables.ts
index 26b859e..dbb3a87 100644
--- a/example/components/assets/styles/variables.ts
+++ b/example/components/assets/styles/variables.ts
@@ -23,6 +23,8 @@ const vars = {
   ...nodeRed,
   ...nodeBlue,
   ...nodeGray,
+  functionTextColor: '#4579EE',
+  functionCodeColor: '#ED745D',
 };
 
 export default vars;
diff --git a/example/components/widgets/ExpandedCustomNodeWidget.tsx b/example/components/widgets/ExpandedCustomNodeWidget.tsx
index 244d45b..cfde1cd 100644
--- a/example/components/widgets/ExpandedCustomNodeWidget.tsx
+++ b/example/components/widgets/ExpandedCustomNodeWidget.tsx
@@ -5,14 +5,15 @@ import {MetaNodeModel} from "../../../dist";
 import {Box, Typography} from "@mui/material";
 import NodeSelection from "./NodeSelection";
 import InputOutputNode from "./InputOutputNode";
+import vars from "../assets/styles/variables";
 
 const styles = {
   root: {
     textColor: {
-      color: '#4579EE',
+      color: vars.functionTextColor
     },
     codeColor: {
-      color: '#ED745D'
+      color: vars.functionCodeColor
     }
   }
 };