diff --git a/src/components/EditorCanvas/Table.jsx b/src/components/EditorCanvas/Table.jsx
index f082bd5..c2f57df 100644
--- a/src/components/EditorCanvas/Table.jsx
+++ b/src/components/EditorCanvas/Table.jsx
@@ -373,8 +373,12 @@ export default function Table(props) {
           ) : settings.showDataTypes ? (
             <div className="flex gap-1 items-center">
               {fieldData.primary && <IconKeyStroked />}
-              {!fieldData.notNull && <span>?</span>}
-              <span>
+              {!fieldData.notNull && <span className="font-mono">?</span>}
+              <span
+                className={
+                  "font-mono " + dbToTypes[database][fieldData.type].color
+                }
+              >
                 {fieldData.type +
                   ((dbToTypes[database][fieldData.type].isSized ||
                     dbToTypes[database][fieldData.type].hasPrecision) &&
diff --git a/src/data/constants.js b/src/data/constants.js
index 80020c1..6020db4 100644
--- a/src/data/constants.js
+++ b/src/data/constants.js
@@ -1,6 +1,18 @@
 export const defaultBlue = "#175e7a";
 export const defaultNoteTheme = "#fcf7ac";
 export const darkBgTheme = "#16161A";
+export const stringColor = "text-orange-500";
+export const intColor = "text-yellow-500";
+export const decimalColor = "text-lime-500";
+export const booleanColor = "text-violet-500";
+export const binaryColor = "text-emerald-500";
+export const enumSetColor = "text-sky-500";
+export const documentColor = "text-indigo-500";
+export const networkIdColor = "text-rose-500";
+export const geometricColor = "text-fuchsia-500";
+export const vectorColor = "text-slate-500";
+export const otherColor = "text-zinc-500";
+export const dateColor = "text-cyan-500";
 export const tableHeaderHeight = 50;
 export const tableWidth = 220;
 export const tableFieldHeight = 36;
diff --git a/src/data/datatypes.js b/src/data/datatypes.js
index afab3ff..c729f76 100644
--- a/src/data/datatypes.js
+++ b/src/data/datatypes.js
@@ -1,4 +1,18 @@
 import { strHasQuotes } from "../utils/utils";
+import {
+  binaryColor,
+  booleanColor,
+  dateColor,
+  decimalColor,
+  documentColor,
+  enumSetColor,
+  geometricColor,
+  intColor,
+  networkIdColor,
+  otherColor,
+  stringColor,
+  vectorColor,
+} from "./constants";
 import { DB } from "./constants";
 
 const intRegex = /^-?\d*$/;
@@ -9,6 +23,7 @@ const binaryRegex = /^[01]+$/;
 const defaultTypesBase = {
   INT: {
     type: "INT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -19,6 +34,7 @@ const defaultTypesBase = {
   },
   SMALLINT: {
     type: "SMALLINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -29,6 +45,7 @@ const defaultTypesBase = {
   },
   BIGINT: {
     type: "BIGINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -39,6 +56,7 @@ const defaultTypesBase = {
   },
   DECIMAL: {
     type: "DECIMAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -48,6 +66,7 @@ const defaultTypesBase = {
   },
   NUMERIC: {
     type: "NUMERIC",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -57,6 +76,7 @@ const defaultTypesBase = {
   },
   NUMBER: {
     type: "NUMBER",
+    color: decimalColor,
     checkDefault: (field) => {
       return /^-?\d+(\.\d+)?$/.test(field.default);
     },
@@ -67,6 +87,7 @@ const defaultTypesBase = {
   },
   FLOAT: {
     type: "FLOAT",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -76,6 +97,7 @@ const defaultTypesBase = {
   },
   DOUBLE: {
     type: "DOUBLE",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -85,6 +107,7 @@ const defaultTypesBase = {
   },
   REAL: {
     type: "REAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -94,6 +117,7 @@ const defaultTypesBase = {
   },
   CHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -108,6 +132,7 @@ const defaultTypesBase = {
   },
   VARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -122,6 +147,7 @@ const defaultTypesBase = {
   },
   VARCHAR2: {
     type: "VARCHAR2",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -136,6 +162,7 @@ const defaultTypesBase = {
   },
   TEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: true,
@@ -145,6 +172,7 @@ const defaultTypesBase = {
   },
   TIME: {
     type: "TIME",
+    color: dateColor,
     checkDefault: (field) => {
       return /^(?:[01]?\d|2[0-3]):[0-5]?\d:[0-5]?\d$/.test(field.default);
     },
@@ -155,6 +183,7 @@ const defaultTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -175,6 +204,7 @@ const defaultTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}-\d{2}-\d{2}$/.test(field.default);
     },
@@ -185,6 +215,7 @@ const defaultTypesBase = {
   },
   DATETIME: {
     type: "DATETIME",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -203,6 +234,7 @@ const defaultTypesBase = {
   },
   BOOLEAN: {
     type: "BOOLEAN",
+    color: booleanColor,
     checkDefault: (field) => {
       return (
         field.default.toLowerCase() === "false" ||
@@ -217,6 +249,7 @@ const defaultTypesBase = {
   },
   BINARY: {
     type: "BINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -230,6 +263,7 @@ const defaultTypesBase = {
   },
   VARBINARY: {
     type: "VARBINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -243,6 +277,7 @@ const defaultTypesBase = {
   },
   BLOB: {
     type: "BLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -251,6 +286,7 @@ const defaultTypesBase = {
   },
   CLOB: {
     type: "CLOB",
+    color: stringColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -259,6 +295,7 @@ const defaultTypesBase = {
   },
   NCLOB: {
     type: "NCLOB",
+    color: stringColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -267,6 +304,7 @@ const defaultTypesBase = {
   },
   JSON: {
     type: "JSON",
+    color: documentColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -275,6 +313,7 @@ const defaultTypesBase = {
   },
   UUID: {
     type: "UUID",
+    color: networkIdColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -283,6 +322,7 @@ const defaultTypesBase = {
   },
   ENUM: {
     type: "ENUM",
+    color: enumSetColor,
     checkDefault: (field) => {
       return field.values.includes(field.default);
     },
@@ -293,6 +333,7 @@ const defaultTypesBase = {
   },
   SET: {
     type: "SET",
+    color: enumSetColor,
     checkDefault: (field) => {
       const defaultValues = field.default.split(",");
       for (let i = 0; i < defaultValues.length; i++) {
@@ -314,6 +355,7 @@ export const defaultTypes = new Proxy(defaultTypesBase, {
 const mysqlTypesBase = {
   TINYINT: {
     type: "TINYINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -325,6 +367,7 @@ const mysqlTypesBase = {
   },
   SMALLINT: {
     type: "SMALLINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -336,6 +379,7 @@ const mysqlTypesBase = {
   },
   MEDIUMINT: {
     type: "MEDIUMINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -347,6 +391,7 @@ const mysqlTypesBase = {
   },
   INTEGER: {
     type: "INTEGER",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -358,6 +403,7 @@ const mysqlTypesBase = {
   },
   BIGINT: {
     type: "BIGINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -369,6 +415,7 @@ const mysqlTypesBase = {
   },
   DECIMAL: {
     type: "DECIMAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -378,6 +425,7 @@ const mysqlTypesBase = {
   },
   NUMERIC: {
     type: "NUMERIC",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -387,6 +435,7 @@ const mysqlTypesBase = {
   },
   FLOAT: {
     type: "FLOAT",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -396,6 +445,7 @@ const mysqlTypesBase = {
   },
   DOUBLE: {
     type: "DOUBLE",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -405,6 +455,7 @@ const mysqlTypesBase = {
   },
   BIT: {
     type: "BIT",
+    color: binaryColor,
     checkDefault: (field) => {
       return field.default === "1" || field.default === "0";
     },
@@ -414,6 +465,7 @@ const mysqlTypesBase = {
   },
   BOOLEAN: {
     type: "BOOLEAN",
+    color: booleanColor,
     checkDefault: (field) => {
       return (
         field.default.toLowerCase() === "false" ||
@@ -428,6 +480,7 @@ const mysqlTypesBase = {
   },
   TIME: {
     type: "TIME",
+    color: dateColor,
     checkDefault: (field) => {
       return /^(?:[01]?\d|2[0-3]):[0-5]?\d:[0-5]?\d$/.test(field.default);
     },
@@ -438,6 +491,7 @@ const mysqlTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -458,6 +512,7 @@ const mysqlTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}-\d{2}-\d{2}$/.test(field.default);
     },
@@ -468,6 +523,7 @@ const mysqlTypesBase = {
   },
   DATETIME: {
     type: "DATETIME",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -486,6 +542,7 @@ const mysqlTypesBase = {
   },
   YEAR: {
     type: "YEAR",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}$/.test(field.default);
     },
@@ -495,6 +552,7 @@ const mysqlTypesBase = {
   },
   CHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -509,6 +567,7 @@ const mysqlTypesBase = {
   },
   VARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -523,6 +582,7 @@ const mysqlTypesBase = {
   },
   BINARY: {
     type: "BINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -536,6 +596,7 @@ const mysqlTypesBase = {
   },
   VARBINARY: {
     type: "VARBINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -549,6 +610,7 @@ const mysqlTypesBase = {
   },
   TINYBLOB: {
     type: "TINYBLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -557,6 +619,7 @@ const mysqlTypesBase = {
   },
   BLOB: {
     type: "BLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -565,6 +628,7 @@ const mysqlTypesBase = {
   },
   MEDIUMBLOB: {
     type: "MEDIUMBLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -573,6 +637,7 @@ const mysqlTypesBase = {
   },
   LONGBLOB: {
     type: "LONGBLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -581,6 +646,7 @@ const mysqlTypesBase = {
   },
   TINYTEXT: {
     type: "TINYTEXT",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -595,6 +661,7 @@ const mysqlTypesBase = {
   },
   TEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -609,6 +676,7 @@ const mysqlTypesBase = {
   },
   MEDIUMTEXT: {
     type: "MEDIUMTEXT",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -623,6 +691,7 @@ const mysqlTypesBase = {
   },
   LONGTEXT: {
     type: "LONGTEXT",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -637,6 +706,7 @@ const mysqlTypesBase = {
   },
   ENUM: {
     type: "ENUM",
+    color: enumSetColor,
     checkDefault: (field) => {
       return field.values.includes(field.default);
     },
@@ -647,6 +717,7 @@ const mysqlTypesBase = {
   },
   SET: {
     type: "SET",
+    color: enumSetColor,
     checkDefault: (field) => {
       const defaultValues = field.default.split(",");
       for (let i = 0; i < defaultValues.length; i++) {
@@ -661,6 +732,7 @@ const mysqlTypesBase = {
   },
   GEOMETRY: {
     type: "GEOMETRY",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -669,6 +741,7 @@ const mysqlTypesBase = {
   },
   POINT: {
     type: "POINT",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -677,6 +750,7 @@ const mysqlTypesBase = {
   },
   LINESTRING: {
     type: "LINESTRING",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -685,6 +759,7 @@ const mysqlTypesBase = {
   },
   POLYGON: {
     type: "POLYGON",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -693,6 +768,7 @@ const mysqlTypesBase = {
   },
   MULTIPOINT: {
     type: "MULTIPOINT",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -701,6 +777,7 @@ const mysqlTypesBase = {
   },
   MULTILINESTRING: {
     type: "MULTILINESTRING",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -709,6 +786,7 @@ const mysqlTypesBase = {
   },
   MULTIPOLYGON: {
     type: "MULTIPOLYGON",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -717,6 +795,7 @@ const mysqlTypesBase = {
   },
   GEOMETRYCOLLECTION: {
     type: "GEOMETRYCOLLECTION",
+    color: geometricColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -725,6 +804,7 @@ const mysqlTypesBase = {
   },
   JSON: {
     type: "JSON",
+    color: documentColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -740,6 +820,7 @@ export const mysqlTypes = new Proxy(mysqlTypesBase, {
 const postgresTypesBase = {
   SMALLINT: {
     type: "SMALLINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -751,6 +832,7 @@ const postgresTypesBase = {
   },
   INTEGER: {
     type: "INTEGER",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -768,6 +850,7 @@ const postgresTypesBase = {
   },
   BIGINT: {
     type: "BIGINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -785,6 +868,7 @@ const postgresTypesBase = {
   },
   DECIMAL: {
     type: "DECIMAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -794,6 +878,7 @@ const postgresTypesBase = {
   },
   NUMERIC: {
     type: "NUMERIC",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -803,6 +888,7 @@ const postgresTypesBase = {
   },
   REAL: {
     type: "REAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -811,7 +897,7 @@ const postgresTypesBase = {
     hasPrecision: true,
   },
   "DOUBLE PRECISION": {
-    type: "DOUBLE PRECISION",
+    type: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -821,6 +907,7 @@ const postgresTypesBase = {
   },
   SMALLSERIAL: {
     type: "SMALLSERIAL",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -831,6 +918,7 @@ const postgresTypesBase = {
   },
   SERIAL: {
     type: "SERIAL",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -847,6 +935,7 @@ const postgresTypesBase = {
   },
   BIGSERIAL: {
     type: "BIGSERIAL",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -857,6 +946,7 @@ const postgresTypesBase = {
   },
   MONEY: {
     type: "MONEY",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -866,6 +956,7 @@ const postgresTypesBase = {
   },
   CHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -880,6 +971,7 @@ const postgresTypesBase = {
   },
   VARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -894,6 +986,7 @@ const postgresTypesBase = {
   },
   TEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -907,6 +1000,7 @@ const postgresTypesBase = {
   },
   BYTEA: {
     type: "BYTEA",
+    color: binaryColor,
     checkDefault: (field) => {
       return /^[0-9a-fA-F]*$/.test(field.default);
     },
@@ -918,6 +1012,7 @@ const postgresTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       const specialValues = [
         "epoch",
@@ -940,6 +1035,7 @@ const postgresTypesBase = {
   },
   TIME: {
     type: "TIME",
+    color: dateColor,
     checkDefault: (field) => {
       const specialValues = ["now", "allballs"];
       return (
@@ -954,6 +1050,7 @@ const postgresTypesBase = {
   },
   TIMETZ: {
     type: "TIMETZ",
+    color: dateColor,
     checkDefault: (field) => {
       const specialValues = ["now", "allballs"];
       return (
@@ -969,6 +1066,7 @@ const postgresTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       const content = field.default.split(" ");
       const date = content[0].split("-");
@@ -996,6 +1094,7 @@ const postgresTypesBase = {
   },
   TIMESTAMPTZ: {
     type: "TIMESTAMPTZ",
+    color: dateColor,
     checkDefault: (field) => {
       const specialValues = [
         "epoch",
@@ -1020,6 +1119,7 @@ const postgresTypesBase = {
   },
   INTERVAL: {
     type: "INTERVAL",
+    color: dateColor,
     checkDefault: (field) => /^['"\d\s\\-]+$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1028,6 +1128,7 @@ const postgresTypesBase = {
   },
   BOOLEAN: {
     type: "BOOLEAN",
+    color: booleanColor,
     checkDefault: (field) => /^(true|false)$/i.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1036,6 +1137,7 @@ const postgresTypesBase = {
   },
   POINT: {
     type: "POINT",
+    color: geometricColor,
     checkDefault: (field) => /^\(\d+,\d+\)$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1044,6 +1146,7 @@ const postgresTypesBase = {
   },
   LINE: {
     type: "LINE",
+    color: geometricColor,
     checkDefault: (field) => /^(\(\d+,\d+\),)+\(\d+,\d+\)$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1052,6 +1155,7 @@ const postgresTypesBase = {
   },
   LSEG: {
     type: "LSEG",
+    color: geometricColor,
     checkDefault: (field) => /^(\(\d+,\d+\),)+\(\d+,\d+\)$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1060,6 +1164,7 @@ const postgresTypesBase = {
   },
   BOX: {
     type: "BOX",
+    color: geometricColor,
     checkDefault: (field) =>
       /^\(\d+(\.\d+)?,\d+(\.\d+)?\),\(\d+(\.\d+)?,\d+(\.\d+)?\)$/.test(
         field.default,
@@ -1071,6 +1176,7 @@ const postgresTypesBase = {
   },
   PATH: {
     type: "PATH",
+    color: geometricColor,
     checkDefault: (field) =>
       /^\((\d+(\.\d+)?,\d+(\.\d+)?(,\d+(\.\d+)?,\d+(\.\d+)?)*?)\)$/.test(
         field.default,
@@ -1082,6 +1188,7 @@ const postgresTypesBase = {
   },
   POLYGON: {
     type: "POLYGON",
+    color: geometricColor,
     checkDefault: (field) =>
       /^\((\d+(\.\d+)?,\d+(\.\d+)?(,\d+(\.\d+)?,\d+(\.\d+)?)*?)\)$/.test(
         field.default,
@@ -1093,6 +1200,7 @@ const postgresTypesBase = {
   },
   CIRCLE: {
     type: "CIRCLE",
+    color: geometricColor,
     checkDefault: (field) =>
       /^<\(\d+(\.\d+)?,\d+(\.\d+)?\),\d+(\.\d+)?\\>$/.test(field.default),
     hasCheck: false,
@@ -1102,6 +1210,7 @@ const postgresTypesBase = {
   },
   CIDR: {
     type: "CIDR",
+    color: networkIdColor,
     checkDefault: (field) =>
       /^(\d{1,3}\.){3}\d{1,3}\/\d{1,2}$/.test(field.default),
     hasCheck: false,
@@ -1111,6 +1220,7 @@ const postgresTypesBase = {
   },
   INET: {
     type: "INET",
+    color: networkIdColor,
     checkDefault: (field) =>
       /^(\d{1,3}\.){3}\d{1,3}(\/\d{1,2})?$/.test(field.default),
     hasCheck: false,
@@ -1120,6 +1230,7 @@ const postgresTypesBase = {
   },
   MACADDR: {
     type: "MACADDR",
+    color: networkIdColor,
     checkDefault: (field) =>
       /^([A-Fa-f0-9]{2}:){5}[A-Fa-f0-9]{2}$/.test(field.default),
     hasCheck: false,
@@ -1129,6 +1240,7 @@ const postgresTypesBase = {
   },
   MACADDR8: {
     type: "MACADDR8",
+    color: networkIdColor,
     checkDefault: (field) =>
       /^([A-Fa-f0-9]{2}:){7}[A-Fa-f0-9]{2}$/.test(field.default),
     hasCheck: false,
@@ -1138,6 +1250,7 @@ const postgresTypesBase = {
   },
   BIT: {
     type: "BIT",
+    color: binaryColor,
     checkDefault: (field) => /^[01]{1,}$/.test(field.default),
     hasCheck: true,
     isSized: true,
@@ -1147,6 +1260,7 @@ const postgresTypesBase = {
   },
   VARBIT: {
     type: "VARBIT",
+    color: binaryColor,
     checkDefault: (field) => /^[01]*$/.test(field.default),
     hasCheck: true,
     isSized: true,
@@ -1156,6 +1270,7 @@ const postgresTypesBase = {
   },
   VECTOR: {
     type: "VECTOR",
+    color: vectorColor,
     checkDefault: (field) => {
       let elements;
       let elementsStr = field.default;
@@ -1180,6 +1295,7 @@ const postgresTypesBase = {
   },
   HALFVEC: {
     type: "HALFVEC",
+    color: vectorColor,
     checkDefault: (field) => {
       let elements;
       let elementsStr = field.default;
@@ -1204,6 +1320,7 @@ const postgresTypesBase = {
   },
   SPARSEVEC: {
     type: "SPARSEVEC",
+    color: vectorColor,
     checkDefault: (field) => {
       let elementsStr = field.default;
       if (strHasQuotes(field.default)) {
@@ -1220,6 +1337,7 @@ const postgresTypesBase = {
   },
   TSVECTOR: {
     type: "TSVECTOR",
+    color: otherColor,
     checkDefault: (field) => /^[A-Za-z0-9: ]*$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1228,6 +1346,7 @@ const postgresTypesBase = {
   },
   TSQUERY: {
     type: "TSQUERY",
+    color: otherColor,
     checkDefault: (field) => /^[A-Za-z0-9: &|!()]*$/.test(field.default),
     hasCheck: false,
     isSized: false,
@@ -1236,6 +1355,7 @@ const postgresTypesBase = {
   },
   JSON: {
     type: "JSON",
+    color: documentColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1245,6 +1365,7 @@ const postgresTypesBase = {
   },
   JSONB: {
     type: "JSONB",
+    color: documentColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1254,6 +1375,7 @@ const postgresTypesBase = {
   },
   UUID: {
     type: "UUID",
+    color: networkIdColor,
     checkDefault: (field) =>
       /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/.test(
         field.default,
@@ -1266,6 +1388,7 @@ const postgresTypesBase = {
   },
   XML: {
     type: "XML",
+    color: documentColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1282,6 +1405,7 @@ export const postgresTypes = new Proxy(postgresTypesBase, {
 const sqliteTypesBase = {
   INTEGER: {
     type: "INTEGER",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1292,6 +1416,7 @@ const sqliteTypesBase = {
   },
   REAL: {
     type: "REAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1301,6 +1426,7 @@ const sqliteTypesBase = {
   },
   NUMERIC: {
     type: "NUMERIC",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1310,6 +1436,7 @@ const sqliteTypesBase = {
   },
   BOOLEAN: {
     type: "BOOLEAN",
+    color: booleanColor,
     checkDefault: (field) => {
       return (
         field.default.toLowerCase() === "false" ||
@@ -1324,6 +1451,7 @@ const sqliteTypesBase = {
   },
   VARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1338,6 +1466,7 @@ const sqliteTypesBase = {
   },
   TEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => true,
     hasCheck: true,
     isSized: true,
@@ -1347,6 +1476,7 @@ const sqliteTypesBase = {
   },
   BLOB: {
     type: "BLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1355,6 +1485,7 @@ const sqliteTypesBase = {
   },
   TIME: {
     type: "TIME",
+    color: dateColor,
     checkDefault: (field) => {
       return /^(?:[01]?\d|2[0-3]):[0-5]?\d:[0-5]?\d$/.test(field.default);
     },
@@ -1365,6 +1496,7 @@ const sqliteTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1385,6 +1517,7 @@ const sqliteTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}-\d{2}-\d{2}$/.test(field.default);
     },
@@ -1395,6 +1528,7 @@ const sqliteTypesBase = {
   },
   DATETIME: {
     type: "DATETIME",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1420,6 +1554,7 @@ export const sqliteTypes = new Proxy(sqliteTypesBase, {
 const mssqlTypesBase = {
   TINYINT: {
     type: "TINYINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1430,6 +1565,7 @@ const mssqlTypesBase = {
   },
   SMALLINT: {
     type: "SMALLINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1440,6 +1576,7 @@ const mssqlTypesBase = {
   },
   INTEGER: {
     type: "INTEGER",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1450,6 +1587,7 @@ const mssqlTypesBase = {
   },
   BIGINT: {
     type: "BIGINT",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1460,6 +1598,7 @@ const mssqlTypesBase = {
   },
   BIT: {
     type: "BIT",
+    color: binaryColor,
     checkDefault: (field) => {
       return field.default === "1" || field.default === "0";
     },
@@ -1469,6 +1608,7 @@ const mssqlTypesBase = {
   },
   DECIMAL: {
     type: "DECIMAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1478,6 +1618,7 @@ const mssqlTypesBase = {
   },
   NUMERIC: {
     type: "NUMERIC",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1487,6 +1628,7 @@ const mssqlTypesBase = {
   },
   FLOAT: {
     type: "FLOAT",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1496,6 +1638,7 @@ const mssqlTypesBase = {
   },
   DOUBLE: {
     type: "DOUBLE",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1505,6 +1648,7 @@ const mssqlTypesBase = {
   },
   REAL: {
     type: "REAL",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1514,6 +1658,7 @@ const mssqlTypesBase = {
   },
   MONEY: {
     type: "MONEY",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1523,6 +1668,7 @@ const mssqlTypesBase = {
   },
   SMALLMONEY: {
     type: "MONEY",
+    color: decimalColor,
     checkDefault: (field) => {
       return doubleRegex.test(field.default);
     },
@@ -1532,6 +1678,7 @@ const mssqlTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}-\d{2}-\d{2}$/.test(field.default);
     },
@@ -1542,6 +1689,7 @@ const mssqlTypesBase = {
   },
   DATETIME: {
     type: "DATETIME",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1560,6 +1708,7 @@ const mssqlTypesBase = {
   },
   DATETIME2: {
     type: "DATETIME2",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1578,6 +1727,7 @@ const mssqlTypesBase = {
   },
   DATETIMEOFFSET: {
     type: "DATETIMEOFFSET",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1600,6 +1750,7 @@ const mssqlTypesBase = {
   },
   SMALLDATETIME: {
     type: "SMALLDATETIME",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1618,6 +1769,7 @@ const mssqlTypesBase = {
   },
   TIME: {
     type: "TIME",
+    color: dateColor,
     checkDefault: (field) => {
       return /^(?:[01]?\d|2[0-3]):[0-5]?\d:[0-5]?\d$/.test(field.default);
     },
@@ -1628,6 +1780,7 @@ const mssqlTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1648,6 +1801,7 @@ const mssqlTypesBase = {
   },
   CHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1662,6 +1816,7 @@ const mssqlTypesBase = {
   },
   VARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1676,6 +1831,7 @@ const mssqlTypesBase = {
   },
   TEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: true,
@@ -1685,6 +1841,7 @@ const mssqlTypesBase = {
   },
   NCHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1699,6 +1856,7 @@ const mssqlTypesBase = {
   },
   NVARCHAR: {
     type: "VARCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1713,6 +1871,7 @@ const mssqlTypesBase = {
   },
   NTEXT: {
     type: "TEXT",
+    color: stringColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: true,
@@ -1722,6 +1881,7 @@ const mssqlTypesBase = {
   },
   BINARY: {
     type: "BINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -1735,6 +1895,7 @@ const mssqlTypesBase = {
   },
   VARBINARY: {
     type: "VARBINARY",
+    color: binaryColor,
     checkDefault: (field) => {
       return (
         field.default.length <= field.size && binaryRegex.test(field.default)
@@ -1748,6 +1909,7 @@ const mssqlTypesBase = {
   },
   IMAGE: {
     type: "IMAGE",
+    color: binaryColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1757,6 +1919,7 @@ const mssqlTypesBase = {
   },
   UNIQUEIDENTIFIER: {
     type: "UNIQUEIDENTIFIER",
+    color: networkIdColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1765,6 +1928,7 @@ const mssqlTypesBase = {
   },
   XML: {
     type: "XML",
+    color: documentColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1774,6 +1938,7 @@ const mssqlTypesBase = {
   },
   CURSOR: {
     type: "CURSOR",
+    color: otherColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1783,6 +1948,7 @@ const mssqlTypesBase = {
   },
   SQL_VARIANT: {
     type: "SQL_VARIANT",
+    color: otherColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1792,6 +1958,7 @@ const mssqlTypesBase = {
   },
   JSON: {
     type: "JSON",
+    color: documentColor,
     checkDefault: (field) => true,
     hasCheck: false,
     isSized: false,
@@ -1808,6 +1975,7 @@ export const mssqlTypes = new Proxy(mssqlTypesBase, {
 const oraclesqlTypesBase = {
   INTEGER: {
     type: "INTEGER",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1818,6 +1986,7 @@ const oraclesqlTypesBase = {
   },
   NUMBER: {
     type: "NUMBER",
+    color: decimalColor,
     checkDefault: (field) => {
       return /^-?\d+(\.\d+)?$/.test(field.default);
     },
@@ -1828,6 +1997,7 @@ const oraclesqlTypesBase = {
   },
   FLOAT: {
     type: "FLOAT",
+    color: decimalColor,
     checkDefault: (field) => {
       return /^-?\d+(\.\d+)?$/.test(field.default);
     },
@@ -1837,6 +2007,7 @@ const oraclesqlTypesBase = {
   },
   LONG: {
     type: "LONG",
+    color: intColor,
     checkDefault: (field) => {
       return intRegex.test(field.default);
     },
@@ -1847,6 +2018,7 @@ const oraclesqlTypesBase = {
   },
   VARCHAR2: {
     type: "VARCHAR2",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1861,6 +2033,7 @@ const oraclesqlTypesBase = {
   },
   NVARCHAR2: {
     type: "VARCHAR2",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1875,6 +2048,7 @@ const oraclesqlTypesBase = {
   },
   CHAR: {
     type: "CHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1889,6 +2063,7 @@ const oraclesqlTypesBase = {
   },
   NCHAR: {
     type: "NCHAR",
+    color: stringColor,
     checkDefault: (field) => {
       if (strHasQuotes(field.default)) {
         return field.default.length - 2 <= field.size;
@@ -1903,6 +2078,7 @@ const oraclesqlTypesBase = {
   },
   CLOB: {
     type: "CLOB",
+    color: stringColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1911,6 +2087,7 @@ const oraclesqlTypesBase = {
   },
   NCLOB: {
     type: "NCLOB",
+    color: stringColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1919,6 +2096,7 @@ const oraclesqlTypesBase = {
   },
   BLOB: {
     type: "BLOB",
+    color: binaryColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1927,6 +2105,7 @@ const oraclesqlTypesBase = {
   },
   BFILE: {
     type: "BFILE",
+    color: otherColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1935,6 +2114,7 @@ const oraclesqlTypesBase = {
   },
   JSON: {
     type: "JSON",
+    color: documentColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1943,6 +2123,7 @@ const oraclesqlTypesBase = {
   },
   VECTOR: {
     type: "VECTOR",
+    color: vectorColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: false,
@@ -1951,6 +2132,7 @@ const oraclesqlTypesBase = {
   },
   DATE: {
     type: "DATE",
+    color: dateColor,
     checkDefault: (field) => {
       return /^\d{4}-\d{2}-\d{2}$/.test(field.default);
     },
@@ -1961,6 +2143,7 @@ const oraclesqlTypesBase = {
   },
   TIMESTAMP: {
     type: "TIMESTAMP",
+    color: dateColor,
     checkDefault: (field) => {
       if (field.default.toUpperCase() === "CURRENT_TIMESTAMP") {
         return true;
@@ -1976,6 +2159,7 @@ const oraclesqlTypesBase = {
   },
   INTERVAL: {
     type: "INTERVAL",
+    color: dateColor,
     checkDefault: (field) => {
       return /^INTERVAL\s'\d+'(\s+DAY|HOUR|MINUTE|SECOND)?$/.test(
         field.default,
@@ -1988,6 +2172,7 @@ const oraclesqlTypesBase = {
   },
   BOOLEAN: {
     type: "BOOLEAN",
+    color: booleanColor,
     checkDefault: (field) => {
       return (
         field.default === "0" ||
@@ -2002,6 +2187,7 @@ const oraclesqlTypesBase = {
   },
   RAW: {
     type: "RAW",
+    color: binaryColor,
     checkDefault: (field) => {
       return /^[0-9A-Fa-f]+$/.test(field.default);
     },
@@ -2020,6 +2206,7 @@ export const oraclesqlTypes = new Proxy(oraclesqlTypesBase, {
 export const mariadbTypesBase = {
   UUID: {
     type: "UUID",
+    color: networkIdColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: true,
@@ -2028,6 +2215,7 @@ export const mariadbTypesBase = {
   },
   INET4: {
     type: "INET4",
+    color: networkIdColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: true,
@@ -2036,6 +2224,7 @@ export const mariadbTypesBase = {
   },
   INET6: {
     type: "INET6",
+    color: networkIdColor,
     checkDefault: (field) => true,
     isSized: false,
     hasCheck: true,