diff --git a/package.json b/package.json
index 2d06c64..1dfeb53 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
         "ace-builds": "1.43.0",
         "ace-diff": "3.0.3",
         "ace-layout": "1.5.0",
-        "ace-linters": "1.8.1",
+        "ace-linters": "1.8.3",
         "bootstrap": "5.3.6",
         "bootstrap-icons": "1.12.1",
         "chokidar": "4.0.3",
@@ -64,7 +64,6 @@
         "rxjs": "7.8.0",
         "socket.io": "4.8.1",
         "uuid": "11.1.0",
-        "web-tree-sitter": "0.25.8",
         "zone.js": "0.15.0"
     },
     "devDependencies": {
diff --git a/src/app/common/services/color-tokenizer.service.ts b/src/app/common/services/color-tokenizer.service.ts
new file mode 100644
index 0000000..6bf8cf2
--- /dev/null
+++ b/src/app/common/services/color-tokenizer.service.ts
@@ -0,0 +1,61 @@
+import { Injectable } from '@angular/core';
+
+import * as ace from "ace-builds/src-min-noconflict/ace";
+
+
+
+@Injectable({
+    providedIn: 'root'
+})
+export class ColorTokenizerService {
+    Rules = {
+        start: [
+            { token: "hex3", regex: "#[A-Fa-f0-9]{3}(?![A-Fa-f0-9])" },
+            { token: "hex6", regex: "#[A-Fa-f0-9]{6}(?![A-Fa-f0-9])" },
+            { token: "hex8", regex: "#[A-Fa-f0-9]{8}(?![A-Fa-f0-9])" },
+            {
+                token: "rgb",
+                regex: /rgb\s*\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*\)/
+            },
+            {
+                token: "rgba",
+                regex: /rgba\s*\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*(?:0(?:\.\d+)?|1(?:\.0+)?)\s*\)/
+            }
+        ]
+    };
+
+    tokenizer!: any;
+    cssLines: {} = {};
+
+
+    public init() {
+        const Tokenizer = ace.require("ace/tokenizer").Tokenizer;
+        this.tokenizer  = new Tokenizer(this.Rules);
+    }
+
+    public async parse(data: string) {
+        const lines = data.split("\n");
+        for (let i = 0; i < lines.length; i++) {
+            const token = this.parseLine( lines[i] );
+            if (!token) continue;
+            this.cssLines[i] = token;
+            this.cssLines[i]["hash"] = btoa(
+                token["value"]
+            );
+        }
+
+        console.log(this.cssLines);
+    }
+
+    public parseLine(line: string): {} | null {
+        const tokens = this.tokenizer.getLineTokens(line, "start").tokens;
+
+        for (let i = 0; i < tokens.length; i++) {
+            if ("text" === tokens[i]["type"]) continue;
+            return tokens[i];
+        }
+
+        return null;
+    }
+
+}
\ No newline at end of file
diff --git a/src/app/common/services/files.service.ts b/src/app/common/services/files.service.ts
index 51dc13b..e559c75 100644
--- a/src/app/common/services/files.service.ts
+++ b/src/app/common/services/files.service.ts
@@ -5,6 +5,7 @@ import { EditSession, UndoManager } from 'ace-builds';
 import { getModeForPath } from 'ace-builds/src-noconflict/ext-modelist';
 
 import { TabsService } from './editor/tabs/tabs.service';
+import { ColorTokenizerService } from './color-tokenizer.service';
 
 import { NewtonFile } from '../types/file.type';
 import { ServiceMessage } from '../types/service-message.type';
@@ -115,6 +116,9 @@ export class FilesService {
                 filePath: path,
                 joinWorkspaceURI: false
             }
+            file.session["colorTokenizer"] = new ColorTokenizerService();
+            file.session["colorTokenizer"].init();
+            file.session["colorTokenizer"].parse(data);
 
             this.files.set(file.path, file);
 	    } catch (error) {