diff --git a/lua/config/lazy.lua b/lua/config/lazy.lua
index d776489..a0f8864 100644
--- a/lua/config/lazy.lua
+++ b/lua/config/lazy.lua
@@ -21,6 +21,7 @@ require("lazy").setup({
 		version = "*", -- try installing the latest stable version for plugins that support semver
 	},
 	ui = {
+		backdrop = 100,
 		border = "rounded",
 		browser = "chrome",
 		throttle = 40,
diff --git a/lua/custom/plugins/onedarkpro.lua b/lua/custom/plugins/onedarkpro.lua
index 73eb3fe..844ab1a 100644
--- a/lua/custom/plugins/onedarkpro.lua
+++ b/lua/custom/plugins/onedarkpro.lua
@@ -1,101 +1,110 @@
 return {
-	-- { "navarasu/onedark.nvim", enabled = false },
-	-- {
-	-- 	"olimorris/onedarkpro.nvim",
-	-- 	priority = 1000, -- Ensure it loads first
-	-- 	config = function()
-	-- 		require("onedarkpro").setup({
-	-- 			styles = {
-	-- 				types = "NONE",
-	-- 				methods = "NONE",
-	-- 				numbers = "NONE",
-	-- 				strings = "NONE",
-	-- 				comments = "italic",
-	-- 				keywords = "bold,italic",
-	-- 				constants = "NONE",
-	-- 				functions = "italic",
-	-- 				operators = "NONE",
-	-- 				variables = "NONE",
-	-- 				parameters = "NONE",
-	-- 				conditionals = "italic",
-	-- 				virtual_text = "NONE",
-	-- 				tags = "italic",
-	-- 			},
-	-- 			colors = {
-	-- 				onedark = {
-	-- 					green = "#99c379",
-	-- 					gray = "#8094b4",
-	-- 					red = "#e06c75",
-	-- 					purple = "#c678dd",
-	-- 					yellow = "#e5c07a",
-	-- 					blue = "#61afef",
-	-- 					cyan = "#56b6c2",
-	-- 					bg_statusline = "#282c34",
-	-- 					indentline = "#3b4261",
-	-- 					float_bg = "#282c34",
-	-- 				},
-	-- 			},
-	-- 			options = {
-	-- 				cursorline = true,
-	-- 				transparency = false,
-	-- 				terminal_colors = true,
-	-- 			},
-	-- 			highlights = {
-	-- 				-- overide cursor line fill colors
-	-- 				LineNr = { fg = "#49505E" }, -- Line number for ":number" and ":#" commands, and when 'number' or 'relativenumber' option is set.
-	-- 				CursorLineNr = { fg = "${blue}" }, -- Like LineNr when 'cursorline' or 'relativenumber' is set for the cursor line.
-	-- 				CursorLine = { bg = "#333842" },
-	-- 				Cursor = { fg = "${bg}", bg = "${fg}" }, -- character under the cursor
-	-- 				lCursor = { fg = "${bg}", bg = "${fg}" }, -- the character under the cursor when |language-mapping| is used (see 'guicursor')
-	-- 				CursorIM = { fg = "${bg}", bg = "${fg}" }, -- like Cursor, but used when in IME mode |CursorIM|
-	-- 				CursorColumn = { bg = "#333842" }, -- Screen-column at the cursor, when 'cursorcolumn' is set.
-	-- 				-- overide nvimtree folder icon fill color
-	-- 				NvimTreeFolderIcon = { fg = "${gray}" },
-	-- 				-- overide nvimtree text fill color folder opened
-	-- 				NvimTreeOpenedFolderName = { fg = "${blue}" },
-	-- 				-- overide nvimtree text fill color root folder
-	-- 				NvimTreeRootFolder = { fg = "${yellow}" },
-	-- 				NvimTreeSpecialFile = { fg = "${yellow}" },
-	-- 				NvimTreeWinSeparator = { fg = "#202329" },
-	-- 				NvimTreeIndentMarker = { fg = "#3E4450" },
-	-- 				-- overide indenline fill color
-	-- 				IblIndent = { fg = "#3E4450" },
-	-- 				-- overide cmp cursorline fill color with #333842
-	-- 				PmenuSel = { bg = "#333842" },
-	-- 				illuminatedWord = { bg = "#3b4261" },
-	-- 				illuminatedCurWord = { bg = "#3b4261" },
-	-- 				IlluminatedWordText = { bg = "#3b4261" },
-	-- 				IlluminatedWordRead = { bg = "#3b4261" },
-	-- 				IlluminatedWordWrite = { bg = "#3b4261" },
-	-- 				StatusLine = { fg = "#f8f8f2", bg = "${bg}" },
-	-- 				StatusLineTerm = { fg = "#f8f8f2", bg = "${bg}" },
-	-- 				BufferLineFill = { bg = "${bg}" },
-	-- 				["@string.special.url.html"] = { fg = "${green}" },
-	-- 				["@text.uri.html"] = { fg = "${green}" },
-	-- 				["@tag.javascript"] = { fg = "${red}" },
-	-- 				["@constructor.javascript"] = { fg = "${red}" },
-	-- 				Pmenu = { fg = "${fg}", bg = "${bg}" },
-	-- 				PmenuThumb = { bg = "${gray}" }, -- Popup menu: Thumb of the scrollbar.
-	-- 				-- overide lualine fill color with bg color
-	-- 				LualineNormal = { bg = "${bg}" },
-	-- 				-- overide lualine_c fill color with bg color
-	-- 				LualineC = { bg = "${bg}" },
-	-- 				-- overide lualine_x fill color with bg color
-	-- 				LualineX = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKey = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKeySeperator = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKeyDesc = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKeyFloat = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKeyValue = { bg = "${bg}" },
-	-- 				-- overide which-key fill color with bg color
-	-- 				WhichKeyBorder = { bg = "${bg}" },
-	-- 			},
-	-- 		})
-	-- 	end,
-	-- },
+	{ "navarasu/onedark.nvim", enabled = false },
+	{
+		"olimorris/onedarkpro.nvim",
+		priority = 1000, -- Ensure it loads first
+		config = function()
+			local is_transparent = false
+			require("onedarkpro").setup({
+				styles = {
+					types = "NONE",
+					methods = "NONE",
+					numbers = "NONE",
+					strings = "NONE",
+					comments = "italic",
+					keywords = "bold,italic",
+					constants = "NONE",
+					functions = "italic",
+					operators = "NONE",
+					variables = "NONE",
+					parameters = "NONE",
+					conditionals = "italic",
+					virtual_text = "NONE",
+					tags = "italic",
+				},
+				colors = {
+					onedark = {
+						green = "#99c379",
+						gray = "#8094b4",
+						red = "#e06c75",
+						purple = "#c678dd",
+						yellow = "#e5c07a",
+						blue = "#61afef",
+						cyan = "#56b6c2",
+						bg_statusline = "#282c34",
+						indentline = "#3b4261",
+						float_bg = "#282c34",
+					},
+				},
+				options = {
+					cursorline = true,
+					transparency = is_transparent,
+					terminal_colors = true,
+				},
+				highlights = {
+					-- overide cursor line fill colors
+					LineNr = { fg = "#49505E" }, -- Line number for ":number" and ":#" commands, and when 'number' or 'relativenumber' option is set.
+					CursorLineNr = { fg = "${blue}" }, -- Like LineNr when 'cursorline' or 'relativenumber' is set for the cursor line.
+					CursorLine = { bg = "#333842" },
+					Cursor = { fg = "${bg}", bg = "${fg}" }, -- character under the cursor
+					lCursor = { fg = "${bg}", bg = "${fg}" }, -- the character under the cursor when |language-mapping| is used (see 'guicursor')
+					CursorIM = { fg = "${bg}", bg = "${fg}" }, -- like Cursor, but used when in IME mode |CursorIM|
+					CursorColumn = { bg = "#333842" }, -- Screen-column at the cursor, when 'cursorcolumn' is set.
+					-- overide nvimtree folder icon fill color
+					NvimTreeFolderIcon = { fg = "${gray}" },
+					-- overide nvimtree text fill color folder opened
+					NvimTreeOpenedFolderName = { fg = "${blue}" },
+					-- overide nvimtree text fill color root folder
+					NvimTreeRootFolder = { fg = "${yellow}" },
+					NvimTreeSpecialFile = { fg = "${orange}" },
+					NvimTreeWinSeparator = { fg = "#202329" },
+					NvimTreeIndentMarker = { fg = "#3E4450" },
+					-- overide indenline fill color
+					IblIndent = { fg = "#3E4450" },
+					-- overide cmp cursorline fill color with #333842
+					PmenuSel = { bg = "#333842" },
+					illuminatedWord = { bg = "#3b4261" },
+					illuminatedCurWord = { bg = "#3b4261" },
+					IlluminatedWordText = { bg = "#3b4261" },
+					IlluminatedWordRead = { bg = "#3b4261" },
+					IlluminatedWordWrite = { bg = "#3b4261" },
+					StatusLine = { fg = "#f8f8f2", bg = is_transparent and "NONE" or "${bg}" },
+					StatusLineTerm = { fg = "#f8f8f2", bg = "${bg}" },
+					BufferLineFill = { bg = is_transparent and "NONE" or "${bg}" },
+					["@string.special.url.html"] = { fg = "${green}" },
+					["@text.uri.html"] = { fg = "${green}" },
+					["@tag.javascript"] = { fg = "${red}" },
+					["@tag.attribute"] = { fg = "${orange}", style = "italic" },
+					["@constructor.javascript"] = { fg = "${red}" },
+					["@variable"] = { fg = "${fg}", style = "NONE" }, -- various variable names
+					["@variable.builtin"] = { fg = "${red}", style = "NONE" },
+					["@variable.member"] = "${cyan}",
+					["@variable.parameter"] = "${red}",
+					["@property"] = { fg = "${cyan}" }, -- similar to `@field`
+					NvimTreeGitDirty = { fg = "${yellow}" },
+					Pmenu = { fg = "${fg}", bg = "${bg}" },
+					PmenuThumb = { bg = "${gray}" }, -- Popup menu: Thumb of the scrollbar.
+					-- overide lualine fill color with bg color
+					LualineNormal = { bg = "${bg}" },
+					-- overide lualine_c fill color with bg color
+					LualineC = { bg = "${bg}" },
+					-- overide lualine_x fill color with bg color
+					LualineX = { bg = "${bg}" },
+					-- overide which-key fill color with bg color
+					-- WhichKey = { bg = "${bg}" },
+					-- -- overide which-key fill color with bg color
+					-- WhichKeySeperator = { bg = "${bg}" },
+					-- -- overide which-key fill color with bg color
+					-- WhichKeyDesc = { fg = "${red}" },
+					-- -- overide which-key fill color with bg color
+					-- WhichKeyFloat = { bg = "${bg}" },
+					WhichKeyFloat = { bg = is_transparent and "NONE" or "${bg}" },
+					-- -- overide which-key fill color with bg color
+					-- WhichKeyValue = { bg = "${bg}" },
+					-- -- overide which-key fill color with bg color
+					-- WhichKeyBorder = { bg = "${bg}" },
+				},
+			})
+		end,
+	},
 }
diff --git a/lua/plugins/colorscheme.lua b/lua/plugins/colorscheme.lua
index d7c78ed..c854f81 100644
--- a/lua/plugins/colorscheme.lua
+++ b/lua/plugins/colorscheme.lua
@@ -354,6 +354,7 @@ return {
 		priority = 1000,
 		config = function()
 			-- Lua
+			local util = require("onedark.util")
 			require("onedark").setup({
 				term_colors = true,
 				style = onedark_style,
@@ -383,7 +384,7 @@ return {
 					-- BorderBG = { fg = "#333842" }, -- untuk custom brder color cmp
 					-- overide indent line fill color
 					NvimTreeNormal = { fg = "$fg", bg = "$bg0" },
-					NvimTreeIndentMarker = { fg = "#3E4450" },
+					NvimTreeIndentMarker = { fg = "#515661" },
 					-- NvimTreeGitIgnored = { fg = "$gray", bg = "NONE" },
 					IblIndent = { fg = "#3E4450" },
 					-- NvimTreeFolderIcon = { bg = "NONE", fg = "$blue" },
diff --git a/lua/plugins/init.lua b/lua/plugins/init.lua
index c216418..f11a9e0 100644
--- a/lua/plugins/init.lua
+++ b/lua/plugins/init.lua
@@ -364,9 +364,29 @@ return {
 		lazy = true,
 		-- event = "BufWinEnter",
 		event = { "BufRead", "InsertEnter", "BufNewFile" },
-		opts = function()
-			require("user.colorizer")
-		end,
+		-- opts = function()
+		-- 	require("user.colorizer")
+		-- end,
+		opts = {
+			user_default_options = {
+				RGB = true, -- #RGB hex codes
+				RRGGBB = true, -- #RRGGBB hex codes
+				names = true, -- "Name" codes like Blue
+				RRGGBBAA = true, -- #RRGGBBAA hex codes
+				rgb_fn = true, -- CSS rgb() and rgba() functions
+				hsl_fn = true, -- CSS hsl() and hsla() functions
+				css = true, -- Enable all CSS features: rgb_fn, hsl_fn, names, RGB, RRGGBB
+				css_fn = true, -- Enable all CSS *functions*: rgb_fn, hsl_fn
+				-- Available modes: foreground, background
+				mode = "background", -- Set the display mode.
+				tailwind = true,
+			},
+			filetypes = {
+				"*", -- Highlight all files, but customize some others.
+				css = { rgb_fn = true }, -- Enable parsing rgb(...) functions in css.
+				html = { names = false }, -- Disable parsing "names" like Blue or Gray
+			},
+		},
 	},
 	-- for winbar icon
 	{
diff --git a/lua/user/icons.lua b/lua/user/icons.lua
index d275f33..c0f90fc 100644
--- a/lua/user/icons.lua
+++ b/lua/user/icons.lua
@@ -82,13 +82,13 @@ return {
 		Calendar = "",
 		Check = "",
 		ChevronRight = "",
-		ChevronShortDown = "",
+		ChevronShortDown = "",
 		ChevronShortLeft = "",
 		ChevronShortRight = "",
 		ChevronShortUp = "",
 		ChevronShortDown2 = " ",
 		ChevronShortLeft2 = "",
-		ChevronShortRight2 = " ",
+		ChevronShortRight2 = "",
 		ChevronShortUp2 = "",
 		Circle = " ",
 		Close = "󰅖",
diff --git a/lua/user/nvim-tree.lua b/lua/user/nvim-tree.lua
index 10469f5..24b4ce9 100644
--- a/lua/user/nvim-tree.lua
+++ b/lua/user/nvim-tree.lua
@@ -55,7 +55,7 @@ nvim_tree.setup({
 		root_folder_label = false,
 		indent_width = 2,
 		indent_markers = {
-			enable = false,
+			enable = true,
 			inline_arrows = true,
 			icons = {
 				corner = "└",
@@ -80,8 +80,10 @@ nvim_tree.setup({
 				symlink = icons.ui.FileSymlink,
 				bookmark = icons.ui.BookMark,
 				folder = {
-					arrow_closed = icons.ui.TriangleShortArrowRight,
-					arrow_open = icons.ui.TriangleShortArrowDown,
+					-- arrow_closed = icons.ui.TriangleShortArrowRight,
+					arrow_closed = icons.ui.ChevronShortRight,
+					-- arrow_open = icons.ui.TriangleShortArrowDown,
+					arrow_open = icons.ui.ChevronShortDown,
 					default = icons.ui.Folder,
 					open = icons.ui.FolderOpen,
 					empty = icons.ui.EmptyFolder,
diff --git a/lua/user/webdevicons.lua b/lua/user/webdevicons.lua
index 0920f8a..1dd8bd4 100644
--- a/lua/user/webdevicons.lua
+++ b/lua/user/webdevicons.lua
@@ -155,6 +155,12 @@ material_icon.setup({
 			cterm_color = "220",
 			name = "jpg",
 		},
+		["jpeg"] = {
+			icon = "󰥶",
+			color = "#88C057",
+			cterm_color = "220",
+			name = "jpeg",
+		},
 		["csv"] = {
 			icon = "󰈚",
 			color = "#57965c",
@@ -493,5 +499,11 @@ web_devicons.setup({
 			cterm_color = "220",
 			name = "gitlabciyaml",
 		},
+		[".env_example"] = {
+			icon = "",
+			color = "#faf743",
+			cterm_color = "227",
+			name = "Envexample",
+		},
 	},
 })