diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index bd13d5a..3e7d00d 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -4,10 +4,12 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="fix: create tool">
+    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="fix: readme">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/Readme.md" beforeDir="false" afterPath="$PROJECT_DIR$/Readme.md" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/scripts/create-tool.mjs" beforeDir="false" afterPath="$PROJECT_DIR$/scripts/create-tool.mjs" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Navbar/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Navbar/index.tsx" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/pages/image/png/change-colors-in-png/meta.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/image/png/change-colors-in-png/meta.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/pages/string/join/meta.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/string/join/meta.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/pages/string/split/meta.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/string/split/meta.ts" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -160,7 +162,7 @@
       <workItem from="1719092003308" duration="14856000" />
       <workItem from="1719164664347" duration="2033000" />
       <workItem from="1719166718305" duration="1783000" />
-      <workItem from="1719168519203" duration="3286000" />
+      <workItem from="1719168519203" duration="3583000" />
     </task>
     <task id="LOCAL-00001" summary="feat: use vite and ts">
       <option name="closed" value="true" />
@@ -458,7 +460,15 @@
       <option name="project" value="LOCAL" />
       <updated>1719171439639</updated>
     </task>
-    <option name="localTasksCounter" value="38" />
+    <task id="LOCAL-00038" summary="fix: readme">
+      <option name="closed" value="true" />
+      <created>1719171905785</created>
+      <option name="number" value="00038" />
+      <option name="presentableId" value="LOCAL-00038" />
+      <option name="project" value="LOCAL" />
+      <updated>1719171905785</updated>
+    </task>
+    <option name="localTasksCounter" value="39" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -500,11 +510,11 @@
     <MESSAGE value="test: join service" />
     <MESSAGE value="feat: result copy and download" />
     <MESSAGE value="feat: contributors graph" />
-    <MESSAGE value="fix: readme" />
     <MESSAGE value="feat: create tool script" />
     <MESSAGE value="fix: missing files" />
     <MESSAGE value="fix: create tool" />
-    <option name="LAST_COMMIT_MESSAGE" value="fix: create tool" />
+    <MESSAGE value="fix: readme" />
+    <option name="LAST_COMMIT_MESSAGE" value="fix: readme" />
   </component>
   <component name="XSLT-Support.FileAssociations.UIState">
     <expand />
diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index f7c480c..460a9ca 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -5,7 +5,7 @@ import Typography from '@mui/material/Typography';
 import Button from '@mui/material/Button';
 import IconButton from '@mui/material/IconButton';
 import { Link, useNavigate } from 'react-router-dom';
-import githubIcon from '../../assets/github-mark.png'; // Adjust the path to your GitHub icon
+import githubIcon from '@assets/github-mark.png'; // Adjust the path to your GitHub icon
 
 const Navbar: React.FC = () => {
   const navigate = useNavigate();
diff --git a/src/pages/image/png/change-colors-in-png/meta.ts b/src/pages/image/png/change-colors-in-png/meta.ts
index c37413c..d165de9 100644
--- a/src/pages/image/png/change-colors-in-png/meta.ts
+++ b/src/pages/image/png/change-colors-in-png/meta.ts
@@ -1,6 +1,6 @@
 import { defineTool } from '@tools/defineTool';
 import { lazy } from 'react';
-import image from '../../../assets/text.png';
+import image from '@assets/text.png';
 
 export const tool = defineTool('image/png', {
   name: 'Change colors in png',
diff --git a/src/pages/string/join/meta.ts b/src/pages/string/join/meta.ts
index 1984a32..1686be5 100644
--- a/src/pages/string/join/meta.ts
+++ b/src/pages/string/join/meta.ts
@@ -1,6 +1,6 @@
-import { defineTool } from '../../../tools/defineTool';
+import { defineTool } from '@tools/defineTool';
 import { lazy } from 'react';
-import image from '../../../assets/text.png';
+import image from '@assets/text.png';
 
 export const tool = defineTool('string', {
   path: 'join',
diff --git a/src/pages/string/split/meta.ts b/src/pages/string/split/meta.ts
index cfc92db..09b4f40 100644
--- a/src/pages/string/split/meta.ts
+++ b/src/pages/string/split/meta.ts
@@ -1,6 +1,6 @@
-import { defineTool } from '../../../tools/defineTool';
+import { defineTool } from '@tools/defineTool';
 import { lazy } from 'react';
-import image from '../../../assets/text.png';
+import image from '@assets/text.png';
 
 export const tool = defineTool('string', {
   path: 'split',