Merge branch 'master' of github.com:Polyfrost/OneConfig

58 files changed, 644 insertions, 198 deletions

diff --git a/src/main/java/io/polyfrost/oneconfig/OneConfig.java b/src/main/java/io/polyfrost/oneconfig/OneConfig.java
index 5e25ee0..3c867b9 100644
--- a/src/main/java/io/polyfrost/oneconfig/OneConfig.java
+++ b/src/main/java/io/polyfrost/oneconfig/OneConfig.java
@@ -8,6 +8,7 @@ import io.polyfrost.oneconfig.config.data.ModType;
 import io.polyfrost.oneconfig.hud.HudCore;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.test.TestConfig;
 import net.minecraft.client.Minecraft;
 import net.minecraftforge.client.ClientCommandHandler;
@@ -52,7 +53,7 @@ public class OneConfig {
         RenderManager.setupAndDraw((vg) -> {
             RenderManager.drawRoundedRect(vg, -100, -100, 50, 50, -1, 12f);
             RenderManager.drawString(vg, "OneConfig loading...", -100, -100, -1, 12f, Fonts.INTER_MEDIUM);
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/icon.png", -100, -100, 50, 50);
+            RenderManager.drawImage(vg, Images.LOGO, -100, -100, 50, 50);
         });
     }
 
diff --git a/src/main/java/io/polyfrost/oneconfig/config/annotations/Option.java b/src/main/java/io/polyfrost/oneconfig/config/annotations/Option.java
index a4f4a67..77831db 100644
--- a/src/main/java/io/polyfrost/oneconfig/config/annotations/Option.java
+++ b/src/main/java/io/polyfrost/oneconfig/config/annotations/Option.java
@@ -32,10 +32,11 @@ public @interface Option {
     String subcategory();
 
 
-    /** A String array of all the possible values for the UniSelector, dropdownList, and ComboBox.
+    /**
+     * A String array of all the possible values for the UniSelector, dropdownList, and ComboBox.
      * Also used in the DualOption slider, index 0 is the left, index 1 is the right; for example:
      * {"Option 1", "Option 2"}
-     * */
+     */
     String[] options() default {};
 
     /**
@@ -62,10 +63,12 @@ public @interface Option {
      * Steps of slider (0 for no steps)
      */
     int step() default 0;
+
     /**
      * Minimum value of slider
      */
     float min() default 0;
+
     /**
      * The maximum value of the slider
      */
diff --git a/src/main/java/io/polyfrost/oneconfig/config/interfaces/BasicOption.java b/src/main/java/io/polyfrost/oneconfig/config/interfaces/BasicOption.java
index 8d19b55..3c02b69 100644
--- a/src/main/java/io/polyfrost/oneconfig/config/interfaces/BasicOption.java
+++ b/src/main/java/io/polyfrost/oneconfig/config/interfaces/BasicOption.java
@@ -1,7 +1,5 @@
 package io.polyfrost.oneconfig.config.interfaces;
 
-import io.polyfrost.oneconfig.gui.elements.BasicElement;
-
 import java.lang.reflect.Field;
 
 @SuppressWarnings({"unused"})
@@ -13,9 +11,9 @@ public abstract class BasicOption {
     /**
      * Initialize option
      *
-     * @param field       variable attached to option (null for category)
-     * @param name        name of option
-     * @param size        size of option, 0 for single column, 1 for double.
+     * @param field variable attached to option (null for category)
+     * @param name  name of option
+     * @param size  size of option, 0 for single column, 1 for double.
      */
     public BasicOption(Field field, String name, int size) {
         this.field = field;
@@ -48,9 +46,9 @@ public abstract class BasicOption {
     /**
      * Function that gets called when drawing option
      *
-     * @param vg     NanoVG context
-     * @param x      x position
-     * @param y      y position
+     * @param vg NanoVG context
+     * @param x  x position
+     * @param y  y position
      */
     public abstract void draw(long vg, int x, int y);
 
@@ -58,9 +56,9 @@ public abstract class BasicOption {
      * Function that gets called last drawing option,
      * should be used for things that draw above other options
      *
-     * @param vg     NanoVG context
-     * @param x      x position
-     * @param y      y position
+     * @param vg NanoVG context
+     * @param x  x position
+     * @param y  y position
      */
     public void drawLast(long vg, int x, int y) {
 
@@ -69,8 +67,8 @@ public abstract class BasicOption {
     /**
      * Function that gets called when a key is typed
      *
-     * @param key char that has been typed
-     * @param keyCode   code of key
+     * @param key     char that has been typed
+     * @param keyCode code of key
      */
     public void keyTyped(char key, int keyCode) {
     }
diff --git a/src/main/java/io/polyfrost/oneconfig/config/interfaces/Config.java b/src/main/java/io/polyfrost/oneconfig/config/interfaces/Config.java
index ca151db..b3c8c75 100644
--- a/src/main/java/io/polyfrost/oneconfig/config/interfaces/Config.java
+++ b/src/main/java/io/polyfrost/oneconfig/config/interfaces/Config.java
@@ -18,7 +18,10 @@ import java.lang.reflect.Field;
 import java.lang.reflect.Modifier;
 import java.nio.charset.StandardCharsets;
 import java.nio.file.Files;
-import java.util.*;
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.Map;
+import java.util.Optional;
 
 public class Config {
     protected final String configFile;
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/OneConfigGui.java b/src/main/java/io/polyfrost/oneconfig/gui/OneConfigGui.java
index 130df7f..930c8cd 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/OneConfigGui.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/OneConfigGui.java
@@ -1,16 +1,23 @@
 package io.polyfrost.oneconfig.gui;
 
 import io.polyfrost.oneconfig.config.OneConfigConfig;
+import io.polyfrost.oneconfig.gui.elements.BasicElement;
+import io.polyfrost.oneconfig.gui.elements.ColorSelector;
 import io.polyfrost.oneconfig.gui.elements.TextInputField;
 import io.polyfrost.oneconfig.gui.pages.HomePage;
 import io.polyfrost.oneconfig.gui.pages.Page;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.MathUtils;
 import net.minecraft.client.gui.GuiScreen;
 import org.jetbrains.annotations.NotNull;
 import org.lwjgl.input.Keyboard;
 import org.lwjgl.input.Mouse;
+import org.lwjgl.nanovg.NanoVG;
+
+import java.awt.*;
+import java.util.ArrayList;
 
 import static org.lwjgl.nanovg.NanoVG.nvgResetScissor;
 import static org.lwjgl.nanovg.NanoVG.nvgScissor;
@@ -28,6 +35,12 @@ public class OneConfigGui extends GuiScreen {
     private float pageProgress = -224f;
 
     private final TextInputField textInputField = new TextInputField(248, 40, "Search all of OneConfig...", false, false);
+    private final ArrayList<Page> pageHistory = new ArrayList<>();
+    private int currentPageIndex = 0;
+    private final BasicElement backArrow = new BasicElement(40, 40, -1, true);
+    private final BasicElement forwardArrow = new BasicElement(40, 40, -1, true);
+
+    private ColorSelector currentColorSelector;
 
     public boolean mouseDown;
 
@@ -57,12 +70,43 @@ public class OneConfigGui extends GuiScreen {
             RenderManager.drawLine(vg, 544, 212, 1600, 212, 1, OneConfigConfig.GRAY_700);
             RenderManager.drawLine(vg, 544, 140, 544, 940, 1, OneConfigConfig.GRAY_700);
 
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/icon.png", x + 19, y + 19, 42, 42);
+            RenderManager.drawImage(vg, Images.LOGO, x + 19, y + 19, 42, 42);
             RenderManager.drawString(vg, "OneConfig", x + 69, y + 32, OneConfigConfig.WHITE, 18f, Fonts.INTER_BOLD);        // added half line height to center text
             RenderManager.drawString(vg, "By Polyfrost", x + 69, y + 51, OneConfigConfig.WHITE, 12f, Fonts.INTER_REGULAR);
             textInputField.draw(vg, x + 1020, y + 16);
-            //element.setColorPalette(0);
             sideBar.draw(vg, x, y);
+            backArrow.draw(vg, x + 240, y + 16);
+            forwardArrow.draw(vg, x + 280, y + 16);
+
+            if (currentPageIndex <= 0) {
+                backArrow.disable(true);
+                NanoVG.nvgGlobalAlpha(vg, 0.5f);
+            } else backArrow.disable(false);
+            RenderManager.drawImage(vg, Images.ARROW_LEFT, x + 250, y + 26, 20, 20);
+            NanoVG.nvgGlobalAlpha(vg, 1f);
+            if (currentPageIndex > pageHistory.size() - 1) {
+                forwardArrow.disable(true);
+                NanoVG.nvgGlobalAlpha(vg, 0.5f);
+            } else forwardArrow.disable(false);
+            RenderManager.drawImage(vg, Images.ARROW_RIGHT, x + 290, y + 26, 20, 20);
+            NanoVG.nvgGlobalAlpha(vg, 1f);
+
+            /*if (backArrow.isClicked()) {      // TODO
+                try {
+                    openPage(pageHistory.get(currentPageIndex--));
+                } catch (Exception e) {
+                    e.printStackTrace();
+                }
+            }
+            if (forwardArrow.isClicked()) {
+                try {
+                    pageHistory.add(currentPage);
+                    openPage(pageHistory.get(currentPageIndex++));
+                } catch (Exception ignored) {
+                }
+            }*/
+
+
             nvgScissor(vg, x + 224, y + 72, 1056, 728);
             if (prevPage != null) {
                 pageProgress = MathUtils.easeInOutCirc(50, pageProgress, 832 - pageProgress, 220);
@@ -77,6 +121,9 @@ public class OneConfigGui extends GuiScreen {
                 currentPage.draw(vg, (int) (x - pageProgress), y + 72);
             }
             nvgResetScissor(vg);
+            if(currentColorSelector != null) {
+                currentColorSelector.draw(vg);
+            }
             long end = System.nanoTime() - start;
             String s = (" draw: " + end / 1000000f + "ms");
             RenderManager.drawString(vg, currentPage.getTitle(), x + 336, y + 36, OneConfigConfig.WHITE_90, 32f, Fonts.INTER_SEMIBOLD);
@@ -97,7 +144,7 @@ public class OneConfigGui extends GuiScreen {
     }
 
     public void openPage(@NotNull Page page) {
-        if(page == currentPage) return;
+        if (page == currentPage) return;
         currentPage.finishUpAndClose();
         if (prevPage == null) {
             prevPage = currentPage;
@@ -105,6 +152,22 @@ public class OneConfigGui extends GuiScreen {
         currentPage = page;
     }
 
+    /**
+     * initialize a new ColorSelector and add it to the draw script. This method is used to make sure it is always rendered on top.
+     * @implNote Correct usage: <code>OneConfigGui.INSTANCE.initColorSelector(new ColorSelector(color, InputUtils.mouseX(), InputUtils.mouseY()));</code>
+     */
+    public void initColorSelector(ColorSelector colorSelector) {
+        currentColorSelector = colorSelector;
+    }
+
+    /** Close the current color selector and return the color it had when it closed.
+     */
+    public Color closeColorSelector() {
+        Color color = currentColorSelector.getColor();
+        currentColorSelector = null;
+        return color;
+    }
+
 
     @Override
     public boolean doesGuiPauseGame() {
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/SideBar.java b/src/main/java/io/polyfrost/oneconfig/gui/SideBar.java
index dc136a7..195e398 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/SideBar.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/SideBar.java
@@ -3,11 +3,10 @@ package io.polyfrost.oneconfig.gui;
 import io.polyfrost.oneconfig.config.OneConfigConfig;
 import io.polyfrost.oneconfig.gui.elements.BasicButton;
 import io.polyfrost.oneconfig.gui.pages.HomePage;
-import io.polyfrost.oneconfig.gui.pages.ModConfigPage;
 import io.polyfrost.oneconfig.gui.pages.ModsPage;
-import io.polyfrost.oneconfig.gui.pages.Page;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.MathUtils;
 import net.minecraft.client.Minecraft;
 
@@ -20,19 +19,19 @@ public class SideBar {
     private float targetY = 0, currentY = 0;
 
     public SideBar() {
-        btnList.add(new BasicButton(192, 36, "Dashboard", "/assets/oneconfig/textures/Dashboard.png", null, -3, BasicButton.ALIGNMENT_LEFT, new HomePage()));
-        btnList.add(new BasicButton(192, 36, "Global Search", "/assets/oneconfig/textures/search.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Mods", "/assets/oneconfig/textures/Mods.png", null, -3, BasicButton.ALIGNMENT_LEFT, new ModsPage()));
-        btnList.add(new BasicButton(192, 36, "Performance", "/assets/oneconfig/textures/Performance.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Profiles", "/assets/oneconfig/textures/Profiles.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Updates", "/assets/oneconfig/textures/Update.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Theme", "/assets/oneconfig/textures/Theme.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Screenshots", "/assets/oneconfig/textures/Image.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "HUD Settings", "/assets/oneconfig/textures/HUDSettings.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Preferences", "/assets/oneconfig/textures/Settings.png", null, -3, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Close", "/assets/oneconfig/textures/XCircle.png", null, -1, BasicButton.ALIGNMENT_LEFT, () -> Minecraft.getMinecraft().displayGuiScreen(null)));
-        btnList.add(new BasicButton(192, 36, "Minimize", "/assets/oneconfig/textures/Minimise.png", null, -1, BasicButton.ALIGNMENT_LEFT));
-        btnList.add(new BasicButton(192, 36, "Edit HUD", "/assets/oneconfig/textures/HUD.png", null, 0, BasicButton.ALIGNMENT_LEFT, () -> Minecraft.getMinecraft().displayGuiScreen(new HudGui())));
+        btnList.add(new BasicButton(192, 36, "Dashboard", Images.DASHBOARD, null, -3, BasicButton.ALIGNMENT_LEFT, new HomePage()));
+        btnList.add(new BasicButton(192, 36, "Global Search", Images.SEARCH, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Mods", Images.MODS, null, -3, BasicButton.ALIGNMENT_LEFT, new ModsPage()));
+        btnList.add(new BasicButton(192, 36, "Performance", Images.PERFORMANCE, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Profiles", Images.PROFILES, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Updates", Images.UPDATES, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Theme", Images.THEMES, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Screenshots", Images.SCREENSHOT, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "HUD Settings", Images.HUD_SETTINGS, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Preferences", Images.PREFERENCES, null, -3, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Close", Images.CLOSE, null, -1, BasicButton.ALIGNMENT_LEFT, () -> Minecraft.getMinecraft().displayGuiScreen(null)));
+        btnList.add(new BasicButton(192, 36, "Minimize", Images.MINIMIZE, null, -1, BasicButton.ALIGNMENT_LEFT));
+        btnList.add(new BasicButton(192, 36, "Edit HUD", Images.HUD, null, 0, BasicButton.ALIGNMENT_LEFT, () -> Minecraft.getMinecraft().displayGuiScreen(new HudGui())));
     }
 
     public void draw(long vg, int x, int y) {
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicButton.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicButton.java
index 1a1dcf7..716ef1e 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicButton.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicButton.java
@@ -5,6 +5,7 @@ import io.polyfrost.oneconfig.gui.OneConfigGui;
 import io.polyfrost.oneconfig.gui.pages.Page;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import org.jetbrains.annotations.NotNull;
 import org.jetbrains.annotations.Nullable;
@@ -12,7 +13,7 @@ import org.jetbrains.annotations.Nullable;
 public class BasicButton extends BasicElement {
 
     protected String text;
-    protected String fileNameLeftIco, fileNameRightIco;
+    protected Images fileNameLeftIco, fileNameRightIco;
     private final int thisAlignment;
     private final float fontSize;
     private final int colorPalette;
@@ -33,11 +34,11 @@ public class BasicButton extends BasicElement {
      * @param colorPalette     color palette to use. see {@link io.polyfrost.oneconfig.utils.ColorUtils} for more info. Can support color palette of -2, which is larger font and icons. Also supports -3, which is just the text changing color.
      * @param alignment        alignment of the button. ALIGNMENT_LEFT or ALIGNMENT_CENTER.
      */
-    public BasicButton(int width, int height, @NotNull String text, @Nullable String fileNameLeftIco, @Nullable String fileNameRightIco, int colorPalette, int alignment) {
+    public BasicButton(int width, int height, @NotNull String text, @Nullable Images fileNameLeftIco, @Nullable Images fileNameRightIco, int colorPalette, int alignment) {
         super(width, height, colorPalette, true);
         this.text = text;
-        this.fileNameLeftIco = fileNameLeftIco;
-        this.fileNameRightIco = fileNameRightIco;
+        if (fileNameLeftIco != null) this.fileNameLeftIco = fileNameLeftIco;
+        if (fileNameRightIco != null) this.fileNameRightIco = fileNameRightIco;
         this.thisAlignment = alignment;
         if (colorPalette == -2) {
             fontSize = 24f;
@@ -48,22 +49,22 @@ public class BasicButton extends BasicElement {
         }
     }
 
-    public BasicButton(int width, int height, @NotNull String text, @Nullable String fileNameLeftIco, @Nullable String fileNameRightIco, int colorPalette, int alignment, Page page) {
+    public BasicButton(int width, int height, @NotNull String text, @Nullable Images fileNameLeftIco, @Nullable Images fileNameRightIco, int colorPalette, int alignment, Page page) {
         this(width, height, text, fileNameLeftIco, fileNameRightIco, colorPalette, alignment);
         this.page = page;
     }
 
-    public BasicButton(int width, int height, @NotNull String text, @Nullable String fileNameLeftIco, @Nullable String fileNameRightIco, int colorPalette, int alignment, boolean toggleable) {
+    public BasicButton(int width, int height, @NotNull String text, @Nullable Images fileNameLeftIco, @Nullable Images fileNameRightIco, int colorPalette, int alignment, boolean toggleable) {
         this(width, height, text, fileNameLeftIco, fileNameRightIco, colorPalette, alignment);
         this.toggleable = toggleable;
     }
 
-    public BasicButton(int width, int height, @NotNull String text, @Nullable String fileNameLeftIco, @Nullable String fileNameRightIco, int colorPalette, int alignment, Runnable runnable) {
+    public BasicButton(int width, int height, @NotNull String text, @Nullable Images fileNameLeftIco, @Nullable Images fileNameRightIco, int colorPalette, int alignment, Runnable runnable) {
         this(width, height, text, fileNameLeftIco, fileNameRightIco, colorPalette, alignment);
         this.runnable = runnable;
     }
 
-    public BasicButton(int width, int height, @NotNull String text, @Nullable String fileNameLeftIco, @Nullable String fileNameRightIco, int colorPalette, int alignment, boolean toggleable, Runnable runnable) {
+    public BasicButton(int width, int height, @NotNull String text, @Nullable Images fileNameLeftIco, @Nullable Images fileNameRightIco, int colorPalette, int alignment, boolean toggleable, Runnable runnable) {
         this(width, height, text, fileNameLeftIco, fileNameRightIco, colorPalette, alignment, runnable);
         this.toggleable = toggleable;
     }
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicElement.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicElement.java
index f31a5ef..dd3956c 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicElement.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/BasicElement.java
@@ -12,6 +12,7 @@ public class BasicElement {
     protected boolean hovered = false;
     protected boolean clicked = false;
     protected boolean toggled = false;
+    protected boolean disabled = false;
     protected int currentColor;
 
     public BasicElement(int width, int height, int colorPalette, boolean hoverFx) {
@@ -39,6 +40,11 @@ public class BasicElement {
     }
 
     public void update(int x, int y) {
+        if(disabled) {
+            hovered = false;
+            clicked = false;
+            return;
+        }
         hovered = InputUtils.isAreaHovered(x - hitBoxX, y - hitBoxY, width + hitBoxX, height + hitBoxY);
         clicked = InputUtils.isClicked() && hovered;
 
@@ -91,4 +97,11 @@ public class BasicElement {
     public boolean isToggled() {
         return toggled;
     }
+
+    public boolean isDisabled() {
+        return disabled;
+    }
+    public void disable(boolean state) {
+        disabled = state;
+    }
 }
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/ColorSelector.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/ColorSelector.java
new file mode 100644
index 0000000..bcf4754
--- /dev/null
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/ColorSelector.java
@@ -0,0 +1,250 @@
+package io.polyfrost.oneconfig.gui.elements;
+
+import io.polyfrost.oneconfig.config.OneConfigConfig;
+import io.polyfrost.oneconfig.lwjgl.RenderManager;
+import io.polyfrost.oneconfig.utils.InputUtils;
+import org.lwjgl.input.Mouse;
+
+import java.awt.*;
+import java.util.ArrayList;
+
+public class ColorSelector {
+    private Color color;
+    private final int x, y;
+    private final int width = 416;
+    private final int height = 768;
+
+    private final BasicElement HSBButton = new BasicElement(128, 32, -1, true);
+    private final BasicElement RGBButton = new BasicElement(128, 32, -1, true);
+    private final BasicElement ChromaButton = new BasicElement(128, 32, -1, true);
+
+    private final ArrayList<BasicElement> faves = new ArrayList<>();
+    private final ArrayList<BasicElement> history = new ArrayList<>();
+    private final BasicElement closeButton = new BasicElement(32, 32, -1, true);
+
+
+    public ColorSelector(Color color, int mouseX, int mouseY) {
+        this.color = color;
+        this.y = mouseY - 768;
+        this.x = mouseX - 208;
+
+    }
+
+    public void draw(long vg) {
+        RenderManager.drawRoundedRect(vg, x, y, width, height, OneConfigConfig.GRAY_800, 20f);
+
+    }
+
+    public Color getColor() {
+        return color;
+    }
+
+
+
+    private class HSBSelector extends ColorSelectorBase {
+
+
+        public HSBSelector(Color color) {
+            super(color);
+        }
+
+        @Override
+        public void drawBox(long vg, int x, int y) {
+
+        }
+
+        @Override
+        public void setColor(Color color) {
+
+        }
+
+        @Override
+        public int[] drawTopSlider() {
+            return new int[0];
+        }
+
+        @Override
+        public int[] drawBottomSlider() {
+            return new int[0];
+        }
+
+        @Override
+        public float[] getColorAtPos(int clickX, int clickY) {
+            return new float[0];
+        }
+    }
+
+
+    private class RGBSelector extends ColorSelectorBase {
+
+        public RGBSelector(Color color) {
+            super(color);
+        }
+
+        @Override
+        public void drawBox(long vg, int x, int y) {
+
+        }
+
+        @Override
+        public void setColor(Color color) {
+
+        }
+
+        @Override
+        public int[] drawTopSlider() {
+            return new int[0];
+        }
+
+        @Override
+        public int[] drawBottomSlider() {
+            return new int[0];
+        }
+
+
+        @Override
+        public float[] getColorAtPos(int clickX, int clickY) {
+            return new float[0];
+        }
+    }
+
+
+
+    private abstract class ColorSelectorBase {
+
+        private int selectedX;
+        private int selectedY;
+        private float[] hsb = new float[3];
+        private float[] rgba;
+        private final TextInputFieldNumber hueField = new TextInputFieldNumber(72, 32, "", 0, 100);
+        private final TextInputFieldNumber saturationField = new TextInputFieldNumber(72, 32, "", 0, 100);
+        private final TextInputFieldNumber brightnessField = new TextInputFieldNumber(72, 32, "", 0, 100);
+        private final TextInputFieldNumber alphaField = new TextInputFieldNumber(72, 32, "", 0, 100);
+
+        private final TextInputField hexField = new TextInputField(107, 32, true, false, "");
+        private final TextInputFieldNumber redField = new TextInputFieldNumber(44, 32, "", 0, 255);
+        private final TextInputFieldNumber greenField = new TextInputFieldNumber(44, 32, "", 0, 255);
+        private final TextInputFieldNumber blueField = new TextInputFieldNumber(44, 32, "", 0, 255);
+
+        private final Slider sliderTop = new Slider(0);
+        private final Slider sliderBottom = new Slider(0);
+
+        public ColorSelectorBase(Color color) {
+            rgba = new float[]{color.getRed() / 255f, color.getGreen() / 255f, color.getBlue() / 255f, color.getAlpha() / 255f};
+        }
+
+        public void updateElements(float[] rgba) {
+            this.rgba = rgba;
+            hsb = Color.RGBtoHSB((int) (rgba[0] * 255), (int) (rgba[1] * 255), (int) (rgba[2] * 255), hsb);
+            hueField.setInput(String.valueOf(hsb[0]));
+            saturationField.setInput(String.valueOf(hsb[1]));
+            brightnessField.setInput(String.valueOf(hsb[2]));
+            alphaField.setInput(String.valueOf(rgba[3]));
+            redField.setInput(String.valueOf(rgba[0]));
+            greenField.setInput(String.valueOf(rgba[1]));
+            blueField.setInput(String.valueOf(rgba[2]));
+        }
+        public abstract void drawBox(long vg, int x, int y);
+
+        /** draw the color selector contents, including the box, and the input fields. If it is clicked, getColorAtPos is called. updateElements is also called to update all the input fields. */
+        public void draw(long vg, int x, int y) {
+            drawBox(vg, x + 16, y + 120);
+            if(InputUtils.isAreaHovered(x + 16, y + 120, 384, 288) && Mouse.isButtonDown(0)) {
+                selectedX = InputUtils.mouseX() - x - 16;
+                selectedY = InputUtils.mouseY() - y - 120;
+                rgba = getColorAtPos(selectedX, selectedY);
+            }           // TODO all of this
+            hueField.draw(vg, x + 104, y + 544);
+            saturationField.draw(vg, x + 312, y + 544);
+            brightnessField.draw(vg, x + 103, y + 584);
+            alphaField.draw(vg, x + 103, y + 584);
+            hexField.draw(vg, x + 96, y + 624);
+            redField.draw(vg, x + 228, y + 624);
+            greenField.draw(vg, x + 292, y + 664);
+            blueField.draw(vg, x + 356, y + 664);
+            sliderTop.draw(vg, x + 16, y + 424, drawTopSlider()[0], drawTopSlider()[1]);
+            sliderBottom.draw(vg, x + 16, y + 576, drawBottomSlider()[0], drawBottomSlider()[1]);
+            updateElements(rgba);
+            Color color1 = new Color(rgba[0], rgba[1], rgba[2], rgba[3]);
+            setColor(color1);
+            RenderManager.drawRoundedRect(vg, x + 16, y + 488, 384, 40, color1.getRGB(), 12f);
+        }
+
+        /** called to set the color of the color selector box based on the values of the input fields. */
+        public abstract void setColor(Color color);
+
+        /** return an array of two ints of the start color of the gradient and the end color of the gradient. */
+        public abstract int[] drawTopSlider();
+        /** return an array of two ints of the start color of the gradient and the end color of the gradient. */
+        public abstract int[] drawBottomSlider();
+
+        /**
+         * This method is called when the color selector is clicked. It needs to return color at the clicked position.
+         * @return color at the clicked position as a <code>float[] rgba.</code>
+         */
+        public abstract float[] getColorAtPos(int clickX, int clickY);
+
+        public float getRed() {
+            return rgba[0];
+        }
+        public float getGreen(){
+            return rgba[1];
+        }
+        public float getBlue(){
+            return rgba[2];
+        }
+        public float getAlpha(){
+            return rgba[3];
+        }
+
+        public float getHue(){
+            return hsb[0];
+        }
+
+        public float getSaturation(){
+            return hsb[1];
+        }
+
+        public float getBrightness(){
+            return hsb[2];
+        }
+
+        public String getHex() {
+            return null;
+        };
+
+        public Color getColor() {
+            return new Color(rgba[0], rgba[1], rgba[2], rgba[3]);
+        }
+
+    }
+
+    private class TextInputFieldNumber extends TextInputField {
+        private final float min, max;
+        public TextInputFieldNumber(int width, int height, String defaultValue, float min, float max) {
+            super(width, height, true, true, defaultValue);
+            this.min = min;
+            this.max = max;
+        }
+
+        @Override
+        public void draw(long vg, int x, int y) {
+            super.draw(vg, x, y);
+
+        }
+    }
+
+    private class Slider {
+        private final int style;
+
+        public Slider(int style) {
+            this.style = style;
+        }
+
+        public void draw(long vg, int x, int y, int color1, int color2) {
+
+        }
+    }
+}
+
+
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/ModCard.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/ModCard.java
index 1587a93..90a3910 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/ModCard.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/ModCard.java
@@ -8,12 +8,11 @@ import io.polyfrost.oneconfig.gui.OneConfigGui;
 import io.polyfrost.oneconfig.gui.pages.ModConfigPage;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import net.minecraft.client.Minecraft;
-import net.minecraft.client.resources.I18n;
 import net.minecraft.command.CommandException;
-import net.minecraft.command.ICommandSender;
 import net.minecraftforge.client.ClientCommandHandler;
 import net.minecraftforge.fml.common.ModMetadata;
 import org.jetbrains.annotations.NotNull;
@@ -50,7 +49,7 @@ public class ModCard extends BasicElement {
         if (iconPath != null) {
             RenderManager.drawImage(vg, iconPath, x, y, width, 87);
         } else {
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/box.png", x + 98, y + 19, 48, 48);
+            RenderManager.drawImage(vg, Images.MOD_BOX, x + 98, y + 19, 48, 48);
         }
         favoriteHitbox.update(x + 212, y + 87);
         favoriteHitbox.currentColor = ColorUtils.getColor(favoriteHitbox.currentColor, favoriteHitbox.colorPalette, favoriteHitbox.hovered, favoriteHitbox.clicked);
@@ -58,9 +57,9 @@ public class ModCard extends BasicElement {
         favorite = favoriteHitbox.isToggled();
         RenderManager.drawString(vg, modData.name, x + 12, y + 103, OneConfigConfig.WHITE, 14f, Fonts.INTER_MEDIUM);
         if (favorite) {
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/love.png", x + 220, y + 95, 16, 16);
+            RenderManager.drawImage(vg, Images.FAVORITE, x + 220, y + 95, 16, 16);
         } else {
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/love_empty.png", x + 220, y + 95, 16, 16);
+            RenderManager.drawImage(vg, Images.FAVORITE_OFF, x + 220, y + 95, 16, 16);
         }
         super.update(x, y);
         isHoveredMain = InputUtils.isAreaHovered(x, y, width, 87);
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/TextInputField.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/TextInputField.java
index 081c99b..04e5676 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/TextInputField.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/TextInputField.java
@@ -40,6 +40,12 @@ public class TextInputField extends BasicElement {
         this.input = "";
     }
 
+    public TextInputField(int width, int height, boolean centered, boolean onlyNums, String defaultText) {
+        this(width, height, defaultText, false, false);
+        this.centered = centered;
+        this.onlyNums = onlyNums;
+    }
+
     public void onlyAcceptNumbers(boolean state) {
         onlyNums = state;
     }
@@ -85,7 +91,7 @@ public class TextInputField extends BasicElement {
                 toggled = false;
             }
             int color = toggled ? OneConfigConfig.WHITE : OneConfigConfig.WHITE_60;
-            if(!toggled) caretPos = input.length();
+            if (!toggled) caretPos = input.length();
             float width;
             StringBuilder s = new StringBuilder();
             if (!password) {
@@ -96,7 +102,7 @@ public class TextInputField extends BasicElement {
                 }
                 width = RenderManager.getTextWidth(vg, s.substring(0, caretPos), 14f, Fonts.INTER_REGULAR);
             }
-            if(hovered) {
+            if (hovered) {
                 while (Mouse.next()) {
                     if (Mouse.getEventButtonState()) {
                         if (Mouse.getEventButton() == 0) {
@@ -127,17 +133,19 @@ public class TextInputField extends BasicElement {
             if (start != 0f && end != 0f && toggled) {
                 RenderManager.drawRect(vg, start, y + height / 2f - 10, end, 20, OneConfigConfig.GRAY_300);
             }
-            if(hovered) {
+            if (hovered) {
                 if (Mouse.isButtonDown(0) && !isDoubleClick) {
                     caretPos = calculatePos(Mouse.getX());
                     if (caretPos > prevCaret) {
-                        if(!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
-                        else start = x + this.width / 2f - halfTextWidth + this.getTextWidth(vg, input.substring(0, prevCaret));
+                        if (!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
+                        else
+                            start = x + this.width / 2f - halfTextWidth + this.getTextWidth(vg, input.substring(0, prevCaret));
                         end = this.getTextWidth(vg, input.substring(prevCaret, caretPos));
                         selectedText = input.substring(prevCaret, caretPos);
                     } else {
-                        if(!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
-                        else start = x + this.width / 2f - halfTextWidth + this.getTextWidth(vg, input.substring(0, prevCaret));
+                        if (!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
+                        else
+                            start = x + this.width / 2f - halfTextWidth + this.getTextWidth(vg, input.substring(0, prevCaret));
                         end = -this.getTextWidth(vg, input.substring(caretPos, prevCaret));
                         selectedText = input.substring(caretPos, prevCaret);
                     }
@@ -146,7 +154,7 @@ public class TextInputField extends BasicElement {
 
 
             if (toggled) {
-                if(!centered) {
+                if (!centered) {
                     RenderManager.drawLine(vg, x + width + 12, (float) y + height / 2f - 10, x + width + 12, (float) y + height / 2f + 10, 1, OneConfigConfig.WHITE);
                 } else {
                     RenderManager.drawLine(vg, x + this.width / 2f - halfTextWidth + width, (float) y + height / 2f - 10, x + this.width / 2f - halfTextWidth + width, (float) y + height / 2f + 10, 1, OneConfigConfig.WHITE);
@@ -155,7 +163,7 @@ public class TextInputField extends BasicElement {
 
 
             if (input.equals("")) {
-                if(!centered) {
+                if (!centered) {
                     RenderManager.drawString(vg, defaultText, x + 12, y + height / 2f + 1, color, 14f, Fonts.INTER_REGULAR);
                 } else {
                     RenderManager.drawString(vg, defaultText, x + this.width / 2f - halfTextWidth, y + height / 2f + 1, color, 14f, Fonts.INTER_REGULAR);
@@ -163,7 +171,7 @@ public class TextInputField extends BasicElement {
             }
 
             if (!password) {
-                if(!centered) {
+                if (!centered) {
                     RenderManager.drawString(vg, input, x + 12, y + height / 2f + 1, color, 14f, Fonts.INTER_REGULAR);
                 } else {
                     RenderManager.drawString(vg, input, x + this.width / 2f - halfTextWidth, y + height / 2f + 1, color, 14f, Fonts.INTER_REGULAR);
@@ -195,7 +203,7 @@ public class TextInputField extends BasicElement {
                         e.printStackTrace();
                     }
                 }
-                if(key == Keyboard.KEY_DELETE) {
+                if (key == Keyboard.KEY_DELETE) {
                     input = "";
                 }
 
@@ -258,7 +266,7 @@ public class TextInputField extends BasicElement {
                     return;
                 }
                 if (key == Keyboard.KEY_TAB) {
-                    if(onlyNums) return;
+                    if (onlyNums) return;
                     input += "    ";
                     caretPos += 4;
                     return;
@@ -311,7 +319,7 @@ public class TextInputField extends BasicElement {
                         end = 0f;
                     }
                 }
-                if(key == Keyboard.KEY_END) {
+                if (key == Keyboard.KEY_END) {
                     toggled = false;
                 }
 
@@ -319,24 +327,24 @@ public class TextInputField extends BasicElement {
                 if (key == Keyboard.KEY_LCONTROL || key == Keyboard.KEY_RCONTROL || key == Keyboard.KEY_LMENU || key == Keyboard.KEY_RMENU || key == Keyboard.KEY_LMETA || key == Keyboard.KEY_RMETA || key == Keyboard.KEY_LSHIFT || key == Keyboard.KEY_RSHIFT || key == Keyboard.KEY_RETURN || key == Keyboard.KEY_CAPITAL || key == 221 || key == Keyboard.KEY_HOME) {
                     return;
                 }
-                if(onlyNums) {
-                    if(!Character.isDigit(c) && key != 52) return;
+                if (onlyNums) {
+                    if (!Character.isDigit(c) && key != 52) return;
                 }
                 if (!Character.isDefined(key)) return;
                 if (!Character.isDefined(c)) return;
-                if(GuiScreen.isCtrlKeyDown()) return;
-                if(ChatAllowedCharacters.isAllowedCharacter(c)) {
-                    if(getTextWidth(vg, input) + 22 > width) {     // over typing is banned
+                if (GuiScreen.isCtrlKeyDown()) return;
+                if (ChatAllowedCharacters.isAllowedCharacter(c)) {
+                    if (getTextWidth(vg, input) + 22 > width) {     // over typing is banned
                         return;
                     }
-                    if(selectedText != null) {
-                        if(caretPos > prevCaret) {
+                    if (selectedText != null) {
+                        if (caretPos > prevCaret) {
                             input = input.substring(0, prevCaret) + input.substring(prevCaret, caretPos);
                             caretPos = prevCaret;
                         } else {
                             input = input.substring(0, caretPos) + input.substring(caretPos, prevCaret);
                         }
-                        if(selectedText.equals(input)) {
+                        if (selectedText.equals(input)) {
                             input = "";
                         }
                         selectedText = null;
@@ -365,17 +373,18 @@ public class TextInputField extends BasicElement {
     }
 
     private void onDoubleClick() {
-        prevCaret = input.substring(0,caretPos).lastIndexOf(' ') + 1;
+        prevCaret = input.substring(0, caretPos).lastIndexOf(' ') + 1;
         caretPos = input.indexOf(' ', caretPos);
-        if(caretPos == -1) caretPos = input.length();
+        if (caretPos == -1) caretPos = input.length();
         selectedText = input.substring(prevCaret, caretPos);
-        if(!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
-        else start = x + this.width / 2f - this.getTextWidth(vg, input) / 2f + this.getTextWidth(vg, input.substring(0, prevCaret));
+        if (!centered) start = x + 12 + this.getTextWidth(vg, input.substring(0, prevCaret));
+        else
+            start = x + this.width / 2f - this.getTextWidth(vg, input) / 2f + this.getTextWidth(vg, input.substring(0, prevCaret));
         end = this.getTextWidth(vg, input.substring(prevCaret, caretPos));
     }
 
     private int calculatePos(int pos) {
-        if(centered) pos -= 12;
+        if (centered) pos -= 12;
         String s1 = "";
         int i;
         for (char c : input.toCharArray()) {
@@ -393,11 +402,11 @@ public class TextInputField extends BasicElement {
         }
         return 0;
     }
-    
+
     private float getTextWidth(long vg, String s) {
-        if(password) {
+        if (password) {
             StringBuilder s1 = new StringBuilder();
-            while(s1.length() < s.length()) {
+            while (s1.length() < s.length()) {
                 s1.append('*');
             }
             return RenderManager.getTextWidth(vg, s1.toString(), 14.0f, Fonts.INTER_REGULAR);
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigCheckbox.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigCheckbox.java
index 93f4378..5f506f7 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigCheckbox.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigCheckbox.java
@@ -4,6 +4,7 @@ import io.polyfrost.oneconfig.config.OneConfigConfig;
 import io.polyfrost.oneconfig.config.interfaces.BasicOption;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import io.polyfrost.oneconfig.utils.MathUtils;
@@ -47,9 +48,9 @@ public class ConfigCheckbox extends BasicOption {
         percentOn = MathUtils.clamp(MathUtils.easeOut(percentOn, toggled ? 1f : 0f, 5f));
         if (percentOn == 0f) return;
         if (percentOn != 1f) {
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/check.png", x, y + 4, 24, 24, new Color(1f, 1f, 1f, percentOn).getRGB());
+            RenderManager.drawImage(vg, Images.CHECKMARK, x, y + 4, 24, 24, new Color(1f, 1f, 1f, percentOn).getRGB());
         } else {       // performance, that color could cause havoc am I right definitely
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/check.png", x, y + 4, 24, 24);
+            RenderManager.drawImage(vg, Images.CHECKMARK, x, y + 4, 24, 24);
         }
     }
 
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigColorElement.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigColorElement.java
new file mode 100644
index 0000000..3525ab6
--- /dev/null
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigColorElement.java
@@ -0,0 +1,115 @@
+package io.polyfrost.oneconfig.gui.elements.config;
+
+import io.polyfrost.oneconfig.config.OneConfigConfig;
+import io.polyfrost.oneconfig.config.interfaces.BasicOption;
+import io.polyfrost.oneconfig.gui.OneConfigGui;
+import io.polyfrost.oneconfig.gui.elements.BasicElement;
+import io.polyfrost.oneconfig.gui.elements.ColorSelector;
+import io.polyfrost.oneconfig.gui.elements.TextInputField;
+import io.polyfrost.oneconfig.lwjgl.RenderManager;
+import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
+import io.polyfrost.oneconfig.utils.InputUtils;
+
+import java.awt.*;
+import java.lang.reflect.Field;
+
+public class ConfigColorElement extends BasicOption {
+    private float alpha;
+    private Color color = Color.BLUE;
+    private String hex;
+
+    private final TextInputField hexField = new TextInputField(104, 32, "", false, false);
+    private final TextInputField alphaField = new TextInputField(72, 32, "", false, false);
+    private final BasicElement element = new BasicElement(64, 32, false);
+
+    public ConfigColorElement(Field field, String name, int size) {
+        super(field, name, size);
+        hexField.setCentered(true);
+        alphaField.setCentered(true);
+        alphaField.onlyAcceptNumbers(true);
+        String buf = Integer.toHexString(color.getRGB());
+        hex = "#"+buf.substring(buf.length()-6);
+    }
+
+    @Override
+    public int getHeight() {
+        return 32;
+    }
+
+    @Override
+    public void draw(long vg, int x, int y) {
+        RenderManager.drawString(vg, name, x, y + 15, OneConfigConfig.WHITE_90, 18f, Fonts.INTER_MEDIUM);
+        hexField.draw(vg, x + 240, y);
+
+        if (!alphaField.isToggled()) alphaField.setInput(String.format("%.01f", alpha * 100f) + "%");
+        alphaField.setErrored(false);
+        if(alphaField.isToggled()) {
+            try {
+                float input = Float.parseFloat(alphaField.getInput());
+                if (input < 0f) {
+                    alphaField.setErrored(true);
+                    input = 100f;
+                }
+                if (input > 100f) {
+                    alphaField.setErrored(true);
+                    input = 100f;
+                }
+                alpha = input / 100f;
+            } catch (NumberFormatException e) {
+                alphaField.setErrored(true);
+            }
+        }
+        alphaField.draw(vg, x + 352, y);
+
+
+
+        if (!hexField.isToggled()) hexField.setInput(hex);
+        hexField.setErrored(false);
+        if(hexField.isToggled()) {
+            try {
+                color = HexToColor(hexField.getInput());
+                String buf = Integer.toHexString(color.getRGB());
+                hex = "#"+buf.substring(buf.length()-6);
+            } catch (NumberFormatException e) {
+                hexField.setErrored(true);
+            }
+        }
+        hexField.draw(vg, x + 352, y);
+
+        element.update(x + 432, y);
+        RenderManager.drawRoundedRect(vg, x + 432, y, 64, 32, OneConfigConfig.GRAY_300, 12f);
+        RenderManager.drawImage(vg, Images.COLOR_BASE, x + 948, y + 4, 56, 24, color.getRGB());
+        if(element.isClicked() && !element.isToggled()) {
+            OneConfigGui.INSTANCE.initColorSelector(new ColorSelector(color, InputUtils.mouseX(), InputUtils.mouseY()));
+        }
+        if(element.isToggled() && element.isClicked()) {
+            color = OneConfigGui.INSTANCE.closeColorSelector();
+            alpha = color.getAlpha() / 255f;
+            String buf = Integer.toHexString(color.getRGB());
+            hex = "#"+buf.substring(buf.length()-6);
+        }
+
+    }
+
+    // thanks stack overflow
+    public static Color HexToColor(String hex) throws NumberFormatException {
+        hex = hex.replace("#", "");
+        switch (hex.length()) {
+            case 6:
+                return new Color(
+                        Integer.valueOf(hex.substring(0, 2), 16),
+                        Integer.valueOf(hex.substring(2, 4), 16),
+                        Integer.valueOf(hex.substring(4, 6), 16));
+            case 8:
+                return new Color(
+                        Integer.valueOf(hex.substring(0, 2), 16),
+                        Integer.valueOf(hex.substring(2, 4), 16),
+                        Integer.valueOf(hex.substring(4, 6), 16),
+                        Integer.valueOf(hex.substring(6, 8), 16));
+        }
+        throw new NumberFormatException("Invalid hex string: " + hex);
+    }
+
+
+}
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigDropdown.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigDropdown.java
index f4b5d0e..d80f242 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigDropdown.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigDropdown.java
@@ -1,10 +1,10 @@
 package io.polyfrost.oneconfig.gui.elements.config;
 
-import io.polyfrost.oneconfig.OneConfig;
 import io.polyfrost.oneconfig.config.OneConfigConfig;
 import io.polyfrost.oneconfig.config.interfaces.BasicOption;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import org.lwjgl.input.Mouse;
@@ -50,17 +50,17 @@ public class ConfigDropdown extends BasicOption { // TODO: chose where dividers
             RenderManager.drawRoundedRect(vg, x + 224, y, 256, 32, backgroundColor, 12);
             RenderManager.drawString(vg, options[selected], x + 236, y + 16, OneConfigConfig.WHITE_80, 14f, Fonts.INTER_MEDIUM);
             RenderManager.drawRoundedRect(vg, x + 452, y + 4, 24, 24, OneConfigConfig.BLUE_600, 8);
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", x + 459, y + 8, 10, 6);
+            RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, x + 459, y + 8, 10, 6);
             NanoVG.nvgTranslate(vg, x + 469, y + 24);
         } else {
             RenderManager.drawRoundedRect(vg, x + 352, y, 640, 32, backgroundColor, 12);
             RenderManager.drawString(vg, options[selected], x + 364, y + 16, OneConfigConfig.WHITE_80, 14f, Fonts.INTER_MEDIUM);
             RenderManager.drawRoundedRect(vg, x + 964, y + 4, 24, 24, OneConfigConfig.BLUE_600, 8);
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", x + 971, y + 8, 10, 6);
+            RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, x + 971, y + 8, 10, 6);
             NanoVG.nvgTranslate(vg, x + 981, y + 24);
         }
         NanoVG.nvgRotate(vg, (float) Math.toRadians(180));
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", 0, 0, 10, 6);
+        RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, 0, 0, 10, 6);
         NanoVG.nvgResetTransform(vg);
         NanoVG.nvgGlobalAlpha(vg, 1f);
     }
@@ -114,7 +114,7 @@ public class ConfigDropdown extends BasicOption { // TODO: chose where dividers
 
             if (hovered && Mouse.isButtonDown(0)) NanoVG.nvgGlobalAlpha(vg, 0.8f);
             RenderManager.drawRoundedRect(vg, x + 452, y + 4, 24, 24, OneConfigConfig.BLUE_600, 8);
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", x + 459, y + 8, 10, 6);
+            RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, x + 459, y + 8, 10, 6);
             NanoVG.nvgTranslate(vg, x + 469, y + 24);
         } else {
             RenderManager.drawRoundedRect(vg, x + 352, y, 640, 32, backgroundColor, 12);
@@ -149,11 +149,11 @@ public class ConfigDropdown extends BasicOption { // TODO: chose where dividers
 
             if (hovered && Mouse.isButtonDown(0)) NanoVG.nvgGlobalAlpha(vg, 0.8f);
             RenderManager.drawRoundedRect(vg, x + 964, y + 4, 24, 24, OneConfigConfig.BLUE_600, 8);
-            RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", x + 971, y + 8, 10, 6);
+            RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, x + 971, y + 8, 10, 6);
             NanoVG.nvgTranslate(vg, x + 981, y + 24);
         }
         NanoVG.nvgRotate(vg, (float) Math.toRadians(180));
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/dropdown_arrow.png", 0, 0, 10, 6);
+        RenderManager.drawImage(vg, Images.DROPDOWN_ARROW, 0, 0, 10, 6);
         NanoVG.nvgResetTransform(vg);
         NanoVG.nvgGlobalAlpha(vg, 1f);
     }
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigPageButton.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigPageButton.java
index c32b76e..fd46bc8 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigPageButton.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigPageButton.java
@@ -7,6 +7,7 @@ import io.polyfrost.oneconfig.gui.OneConfigGui;
 import io.polyfrost.oneconfig.gui.pages.ModConfigPage;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import org.lwjgl.input.Mouse;
@@ -38,7 +39,7 @@ public class ConfigPageButton extends BasicOption {
         RenderManager.drawString(vg, name, x + 10, y + 32, OneConfigConfig.WHITE_90, 24, Fonts.INTER_MEDIUM);
         if (!description.equals(""))
             RenderManager.drawString(vg, name, x + 10, y + 70, OneConfigConfig.WHITE_90, 14, Fonts.INTER_MEDIUM);
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/arrow.png", x + 981f, y + (description.equals("") ? 20f : 36f), 13, 22);
+        RenderManager.drawImage(vg, Images.CHEVRON_ARROW, x + 981f, y + (description.equals("") ? 20f : 36f), 13, 22);
 
         if (clicked) OneConfigGui.INSTANCE.openPage(new ModConfigPage(page));
         NanoVG.nvgGlobalAlpha(vg, 1f);
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigSlider.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigSlider.java
index 25b3eab..47ce15c 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigSlider.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigSlider.java
@@ -6,6 +6,7 @@ import io.polyfrost.oneconfig.gui.elements.BasicElement;
 import io.polyfrost.oneconfig.gui.elements.TextInputField;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.ColorUtils;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import io.polyfrost.oneconfig.utils.MathUtils;
@@ -24,7 +25,7 @@ public class ConfigSlider extends BasicOption {
     private int colorTop, colorBottom;
     private boolean isFloat = true;
     private Float prevAsNum = null;
-    private int step;
+    private final int step;
 
     public ConfigSlider(Field field, String name, int size, float min, float max, int step) {
         super(field, name, size);
@@ -128,14 +129,14 @@ public class ConfigSlider extends BasicOption {
         }
         if (current == 1f) NanoVG.nvgGlobalAlpha(vg, 0.3f);
         RenderManager.drawRoundedRectVaried(vg, x + 980, y, 12, 14, colorTop, 6f, 6f, 0f, 0f);
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/smallUpArrow.png", x + 981, y + 2, 10, 10);
+        RenderManager.drawImage(vg, Images.UP_ARROW, x + 981, y + 2, 10, 10);
         if (current == 1f) NanoVG.nvgGlobalAlpha(vg, 1f);
 
         if (current == 0f) NanoVG.nvgGlobalAlpha(vg, 0.3f);
         RenderManager.drawRoundedRectVaried(vg, x + 980, y + 14, 12, 14, colorBottom, 0f, 0f, 6f, 6f);
         NanoVG.nvgTranslate(vg, x + 991, y + 25);
         NanoVG.nvgRotate(vg, (float) Math.toRadians(180));
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/smallUpArrow.png", 0, 0, 10, 10);
+        RenderManager.drawImage(vg, Images.UP_ARROW, 0, 0, 10, 10);
         NanoVG.nvgResetTransform(vg);
         NanoVG.nvgGlobalAlpha(vg, 1f);
 
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigTextBox.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigTextBox.java
index b999137..8cd7565 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigTextBox.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigTextBox.java
@@ -5,6 +5,7 @@ import io.polyfrost.oneconfig.config.interfaces.BasicOption;
 import io.polyfrost.oneconfig.gui.elements.TextInputField;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.InputUtils;
 
 import java.awt.*;
@@ -28,13 +29,14 @@ public class ConfigTextBox extends BasicOption {
 
         try {
             String value = (String) get();
-           textField.setInput(value == null ? "" : value);
+            textField.setInput(value == null ? "" : value);
         } catch (IllegalAccessException ignored) {
         }
 
         textField.draw(vg, x + (size == 1 && hasHalfSize() ? 224 : 352), y);
 
-        if (secure) RenderManager.drawImage(vg, "/assets/oneconfig/textures/eye.png", x + 967, y + 7, 18, 18, new Color(196,196,196).getRGB());
+        if (secure)
+            RenderManager.drawImage(vg, Images.HIDE_EYE, x + 967, y + 7, 18, 18, new Color(196, 196, 196).getRGB());
         if (secure && InputUtils.isAreaClicked(x + 967, y + 7, 18, 18)) textField.setPassword(!textField.getPassword());
     }
 
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigUniSelector.java b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigUniSelector.java
index 5acdae0..18bebbf 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigUniSelector.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/elements/config/ConfigUniSelector.java
@@ -4,6 +4,7 @@ import io.polyfrost.oneconfig.config.OneConfigConfig;
 import io.polyfrost.oneconfig.config.interfaces.BasicOption;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import io.polyfrost.oneconfig.utils.InputUtils;
 import io.polyfrost.oneconfig.utils.MathUtils;
 import org.lwjgl.nanovg.NanoVG;
@@ -49,9 +50,9 @@ public class ConfigUniSelector extends BasicOption {
         // actual coordinates: 240, 7
         NanoVG.nvgTranslate(vg, x + 248, y + 21);
         NanoVG.nvgRotate(vg, (float) Math.toRadians(180));
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/arrow.png", 0, 0, 8, 14, OneConfigConfig.BLUE_400);
+        RenderManager.drawImage(vg, Images.CHEVRON_ARROW, 0, 0, 8, 14, OneConfigConfig.BLUE_400);
         NanoVG.nvgResetTransform(vg);
-        RenderManager.drawImage(vg, "/assets/oneconfig/textures/arrow.png", x + 456, y + 7, 8, 14, OneConfigConfig.BLUE_400);
+        RenderManager.drawImage(vg, Images.CHEVRON_ARROW, x + 456, y + 7, 8, 14, OneConfigConfig.BLUE_400);
 
         if (InputUtils.isAreaClicked(x + 235, y + 5, 18, 18) && selected > 0) {
             previous = selected;
diff --git a/src/main/java/io/polyfrost/oneconfig/gui/pages/HomePage.java b/src/main/java/io/polyfrost/oneconfig/gui/pages/HomePage.java
index 667b02e..0dfd983 100644
--- a/src/main/java/io/polyfrost/oneconfig/gui/pages/HomePage.java
+++ b/src/main/java/io/polyfrost/oneconfig/gui/pages/HomePage.java
@@ -4,9 +4,10 @@ import io.polyfrost.oneconfig.config.OneConfigConfig;
 import io.polyfrost.oneconfig.gui.elements.BasicButton;
 import io.polyfrost.oneconfig.lwjgl.RenderManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 
 public class HomePage extends Page {
-    private final BasicButton btn = new BasicButton(184, 36, "Socials", "/assets/oneconfig/textures/share.png", "/assets/oneconfig/textures/share2.png", 1, BasicButton.ALIGNMENT_CENTER);
+    private final BasicButton btn = new BasicButton(184, 36, "Socials", Images.SHARE, Images.LAUNCH, 1, BasicButton.ALIGNMENT_CENTER);
 
     public HomePage() {
         super("Home Dashboard");
diff --git a/src/main/java/io/polyfrost/oneconfig/lwjgl/IOUtil.java b/src/main/java/io/polyfrost/oneconfig/lwjgl/IOUtil.java
index 2127251..de0f3d7 100644
--- a/src/main/java/io/polyfrost/oneconfig/lwjgl/IOUtil.java
+++ b/src/main/java/io/polyfrost/oneconfig/lwjgl/IOUtil.java
@@ -2,7 +2,10 @@ package io.polyfrost.oneconfig.lwjgl;
 
 import org.apache.commons.io.IOUtils;
 
-import java.io.*;
+import java.io.File;
+import java.io.FileNotFoundException;
+import java.io.IOException;
+import java.io.InputStream;
 import java.net.URL;
 import java.nio.Buffer;
 import java.nio.ByteBuffer;
diff --git a/src/main/java/io/polyfrost/oneconfig/lwjgl/RenderManager.java b/src/main/java/io/polyfrost/oneconfig/lwjgl/RenderManager.java
index 223dc17..2bc09df 100644
--- a/src/main/java/io/polyfrost/oneconfig/lwjgl/RenderManager.java
+++ b/src/main/java/io/polyfrost/oneconfig/lwjgl/RenderManager.java
@@ -1,24 +1,23 @@
 package io.polyfrost.oneconfig.lwjgl;
 
 import io.polyfrost.oneconfig.config.OneConfigConfig;
-import io.polyfrost.oneconfig.lwjgl.font.Font;
 import io.polyfrost.oneconfig.lwjgl.font.FontManager;
 import io.polyfrost.oneconfig.lwjgl.font.Fonts;
 import io.polyfrost.oneconfig.lwjgl.image.Image;
 import io.polyfrost.oneconfig.lwjgl.image.ImageLoader;
+import io.polyfrost.oneconfig.lwjgl.image.Images;
 import net.minecraft.client.Minecraft;
 import net.minecraft.client.gui.ScaledResolution;
 import net.minecraft.client.renderer.GlStateManager;
 import net.minecraft.client.shader.Framebuffer;
-import org.lwjgl.nanovg.*;
+import org.lwjgl.nanovg.NVGColor;
+import org.lwjgl.nanovg.NVGPaint;
 import org.lwjgl.opengl.Display;
 import org.lwjgl.opengl.GL11;
 
 import java.awt.*;
-import java.nio.FloatBuffer;
 import java.util.function.LongConsumer;
 
-import static org.lwjgl.nanovg.NanoSVG.NSVG_FLAGS_VISIBLE;
 import static org.lwjgl.nanovg.NanoVG.*;
 import static org.lwjgl.nanovg.NanoVGGL2.NVG_ANTIALIAS;
 import static org.lwjgl.nanovg.NanoVGGL2.nvgCreate;
@@ -66,7 +65,7 @@ public final class RenderManager {
         GlStateManager.popAttrib();
     }
 
-    public static void drawRectangle(long vg, float x, float y, float width, float height, int color) {
+    public static void drawRectangle(long vg, float x, float y, float width, float height, int color) {     // TODO make everything use this one day
         if (OneConfigConfig.ROUNDED_CORNERS) {
             drawRoundedRect(vg, x, y, width, height, color, OneConfigConfig.CORNER_RADIUS);
         } else {
@@ -74,13 +73,6 @@ public final class RenderManager {
         }
     }
 
-    public static void drawGradientRectangle(long vg, float x, float y, float width, float height, int color1, int color2) {
-        if (OneConfigConfig.ROUNDED_CORNERS) {
-            drawGradientRoundedRect(vg, x, y, width, height, color1, color2, OneConfigConfig.CORNER_RADIUS);
-        } else {
-            drawGradientRect(vg, x, y, width, height, color1, color2);
-        }
-    }
 
     public static void drawGradientRoundedRect(long vg, float x, float y, float width, float height, int color, int color2, float radius) {
         NVGPaint bg = NVGPaint.create();
@@ -165,14 +157,22 @@ public final class RenderManager {
         nvgColor.free();
     }
 
-    public static void drawWrappedString(long vg, String text, float x, float y, float width, int color, float size, Font font) {
-        drawWrappedString(vg, text, x, y, width, color, size, font.getName());
+    public static void drawString(long vg, String text, float x, float y, int color, float size, int lineHeight, Fonts font) {
+        nvgBeginPath(vg);
+        nvgFontSize(vg, size);
+        nvgFontFace(vg, font.font.getName());
+        nvgTextAlign(vg, NVG_ALIGN_LEFT | NVG_ALIGN_TOP);
+        nvgTextLineHeight(vg, lineHeight);
+        NVGColor nvgColor = color(vg, color);
+        nvgText(vg, x, y, text);
+        nvgFill(vg);
+        nvgColor.free();
     }
 
-    public static void drawWrappedString(long vg, String text, float x, float y, float width, int color, float size, String fontName) {
+    public static void drawWrappedString(long vg, String text, float x, float y, float width, int color, float size, Fonts font) {
         nvgBeginPath(vg);
         nvgFontSize(vg, size);
-        nvgFontFace(vg, fontName);
+        nvgFontFace(vg, font.font.getName());
         nvgTextAlign(vg, NVG_ALIGN_LEFT | NVG_ALIGN_MIDDLE);
         NVGColor nvgColor = color(vg, color);
         nvgTextBox(vg, x, y, width, text);
@@ -180,10 +180,10 @@ public final class RenderManager {
         nvgColor.free();
     }
 
-    public static void drawImage(long vg, String fileName, float x, float y, float width, float height) {
-        if (ImageLoader.INSTANCE.loadImage(vg, fileName)) {
+    public static void drawImage(long vg, String filePath, float x, float y, float width, float height) {
+        if (ImageLoader.INSTANCE.loadImage(vg, filePath)) {
             NVGPaint imagePaint = NVGPaint.calloc();
-            Image image = ImageLoader.INSTANCE.getImage(fileName);
+            Image image = ImageLoader.INSTANCE.getImage(filePath);
             nvgBeginPath(vg);
             nvgImagePattern(vg, x, y, width, height, 0, image.getReference(), 1, imagePaint);
             nvgRect(vg, x, y, width, height);
@@ -193,10 +193,10 @@ public final class RenderManager {
         }
     }
 
-    public static void drawImage(long vg, String fileName, float x, float y, float width, float height, int color) {
-        if (ImageLoader.INSTANCE.loadImage(vg, fileName)) {
+    public static void drawImage(long vg, String filePath, float x, float y, float width, float height, int color) {
+        if (ImageLoader.INSTANCE.loadImage(vg, filePath)) {
             NVGPaint imagePaint = NVGPaint.calloc();
-            Image image = ImageLoader.INSTANCE.getImage(fileName);
+            Image image = ImageLoader.INSTANCE.getImage(filePath);
             nvgBeginPath(vg);
             nvgImagePattern(vg, x, y, width, height, 0, image.getReference(), 1, imagePaint);
             nvgRGBA((byte) (color >> 16 & 0xFF), (byte) (color >> 8 & 0xFF), (byte) (color & 0xFF), (byte) (color >> 24 & 0xFF), imagePaint.innerColor());
@@ -207,42 +207,15 @@ public final class RenderManager {
         }
     }
 
-    public static void drawSVGImage(long vg, String fileName, float x, float y, float width, float height) {
-        if (ImageLoader.INSTANCE.loadSVGImage(fileName)) {
-            try {
-                NSVGImage image = ImageLoader.INSTANCE.getSVG(fileName);
-                NSVGShape shape;
-                NSVGPath path;
-                int i;
-                for (shape = image.shapes(); shape != null; shape.next()) {
-                    if ((shape.flags() == NSVG_FLAGS_VISIBLE)) {
-                        continue;
-                    }
-
-                    nvgFillColor(vg, color(vg, shape.fill().color()));
-                    nvgStrokeColor(vg, color(vg, shape.stroke().color()));
-                    nvgStrokeWidth(vg, shape.strokeWidth());
-
-                    for (path = shape.paths(); path != null; path.next()) {
-                        nvgBeginPath(vg);
-                        FloatBuffer points = path.pts();
-                        nvgMoveTo(vg, points.get(0), points.get(1));
-                        for (i = 1; i < path.npts() - 1; i += 3) {
-                            int b = i * 2;
-                            nvgBezierTo(vg, points.get(b), points.get(b + 1), points.get(b + 2), points.get(b + 3), points.get(b + 4), points.get(b + 5));
-                        }
-                        if (path.closed() == 1) {
-                            nvgLineTo(vg, points.get(0), points.get(1));
-                        }
-                        nvgStroke(vg);
-                    }
-                }
-            } catch (Exception e) {
-                //e.printStackTrace();
-            }
-        }
+    public static void drawImage(long vg, Images filePath, float x, float y, float width, float height) {
+        drawImage(vg, filePath.filePath, x, y, width, height);
     }
 
+    public static void drawImage(long vg, Images filePath, float x, float y, float width, float height, int color) {
+        drawImage(vg, filePath.filePath, x, y, width, height, color);
+    }
+
+
     public static float getTextWidth(long vg, String text, float fontSize, Fonts font) {
         float[] bounds = new float[4];
         nvgFontSize(vg, fontSize);
@@ -277,7 +250,6 @@ public final class RenderManager {
         shadowPaint.free();
         color1.free();
         color2.free();
-
     }
 
 
@@ -288,7 +260,11 @@ public final class RenderManager {
         return nvgColor;
     }
 
-    //gl
+
+    // gl
+    public static void glColor(Color color) {
+        glColor(color.getRGB());
+    }
 
     public static void drawScaledString(String text, float x, float y, int color, boolean shadow, float scale) {
         GlStateManager.pushMatrix();
@@ -297,11 +273,7 @@ public final class RenderManager {
         GlStateManager.popMatrix();
     }
 
-    public static void color(Color color) {
-        color(color.getRGB());
-    }
-
-    public static void color(int color) {
+    public static void glColor(int color) {
         float f = (float) (color >> 24 & 255) / 255.0F;
         float f1 = (float) (color >> 16 & 255) / 255.0F;
         float f2 = (float) (color >> 8 & 255) / 255.0F;
@@ -318,7 +290,7 @@ public final class RenderManager {
         GlStateManager.enableBlend();
         GlStateManager.disableAlpha();
         GlStateManager.tryBlendFuncSeparate(770, 771, 1, 0);
-        color(color);
+        glColor(color);
         GL11.glLineWidth(width);
         GL11.glBegin(GL11.GL_LINES);
         GL11.glVertex2d(sx, sy);
diff --git a/src/main/java/io/polyfrost/oneconfig/lwjgl/image/ImageLoader.java b/src/main/java/io/polyfrost/oneconfig/lwjgl/image/ImageLoader.java
index 37466b2..1ccafaf 100644
--- a/src/main/java/io/polyfrost/oneconfig/lwjgl/image/ImageLoader.java
+++ b/src/main/java/io/polyfrost/oneconfig/lwjgl/image/ImageLoader.java
@@ -1,22 +1,14 @@
 package io.polyfrost.oneconfig.lwjgl.image;
 
 import io.polyfrost.oneconfig.lwjgl.IOUtil;
-import net.minecraft.client.Minecraft;
-import net.minecraft.util.ResourceLocation;
-import org.lwjgl.nanovg.NSVGImage;
-import org.lwjgl.nanovg.NanoSVG;
 import org.lwjgl.nanovg.NanoVG;
 import org.lwjgl.stb.STBImage;
 
-import java.io.BufferedReader;
-import java.io.InputStream;
-import java.io.InputStreamReader;
 import java.nio.ByteBuffer;
 import java.util.HashMap;
 
 public class ImageLoader {
     private final HashMap<String, Image> imageHashMap = new HashMap<>();
-    private final HashMap<String, NSVGImage> NSVGImageHashMap = new HashMap<>();
     public static ImageLoader INSTANCE = new ImageLoader();
 
     public boolean loadImage(long vg, String fileName) {
@@ -41,32 +33,6 @@ public class ImageLoader {
         return true;
     }
 
-    public boolean loadSVGImage(String fileName) {
-        if (!NSVGImageHashMap.containsKey(fileName)) {
-            try {
-                InputStream inputStream = Minecraft.getMinecraft().getResourceManager().getResource(new ResourceLocation("oneconfig", fileName)).getInputStream();
-                StringBuilder resultStringBuilder = new StringBuilder();
-                try (BufferedReader br
-                             = new BufferedReader(new InputStreamReader(inputStream))) {
-                    String line;
-                    while ((line = br.readLine()) != null) {
-                        resultStringBuilder.append(line);
-                    }
-                }
-                CharSequence s = resultStringBuilder.toString();
-                System.out.println(s);
-                NSVGImage image = NanoSVG.nsvgParse(s, "px", 96f);
-                NSVGImageHashMap.put(fileName, image);
-                System.out.println("Loaded SVG: " + fileName);
-            } catch (Exception e) {             // just in case
-                System.err.println("Failed to parse SVG file");
-                e.printStackTrace();
-                return false;
-            }
-            return true;
-        }
-        return true;
-    }
 
     public void removeImage(String fileName) {
         imageHashMap.remove(fileName);
@@ -76,7 +42,4 @@ public class ImageLoader {
         return imageHashMap.get(fileName);
     }
 
-    public NSVGImage getSVG(String fileName) {
-        return NSVGImageHashMap.get(fileName);
-    }
 }
diff --git a/src/main/java/io/polyfrost/oneconfig/lwjgl/image/Images.java b/src/main/java/io/polyfrost/oneconfig/lwjgl/image/Images.java
new file mode 100644
index 0000000..cdd79e3
--- /dev/null
+++ b/src/main/java/io/polyfrost/oneconfig/lwjgl/image/Images.java
@@ -0,0 +1,48 @@
+package io.polyfrost.oneconfig.lwjgl.image;
+
+public enum Images {
+    CHEVRON_ARROW("/assets/oneconfig/textures/gui/general/arrows/chevron.png"),
+    DROPDOWN_ARROW("/assets/oneconfig/textures/gui/general/arrows/dropdown_arrow.png"),
+    UP_ARROW("/assets/oneconfig/textures/gui/general/arrows/up_arrow.png"),
+    ARROW_RIGHT("/assets/oneconfig/textures/gui/general/arrows/arrow_right.png"),
+    ARROW_LEFT("/assets/oneconfig/textures/gui/general/arrows/arrow_left.png"),
+
+    CHECKMARK("/assets/oneconfig/textures/gui/general/configs/checkmark.png"),
+    FAVORITE("/assets/oneconfig/textures/gui/general/configs/favorite_active.png"),
+    FAVORITE_OFF("/assets/oneconfig/textures/gui/general/configs/favorite_inactive.png"),
+    HIDE_EYE("/assets/oneconfig/textures/gui/general/configs/hide_eye.png"),
+    HIDE_EYE_OFF("/assets/oneconfig/textures/gui/general/configs/hide_eye_off.png"),
+
+    // TODO color picker ones
+    COLOR_BASE("/assets/oneconfig/textures/gui/general/color/color_base.png"),
+
+
+    SHARE("/assets/oneconfig/textures/gui/general/nav/share.png"),
+    LAUNCH("/assets/oneconfig/textures/gui/general/nav/launch.png"),
+    SEARCH("/assets/oneconfig/textures/gui/general/nav/search.png"),
+    MINIMIZE("/assets/oneconfig/textures/gui/general/nav/minimize.png"),
+    CLOSE("/assets/oneconfig/textures/gui/general/nav/close.png"),
+
+    LOGO("/assets/oneconfig/textures/gui/general/logo.png"),
+
+    HUD("/assets/oneconfig/textures/gui/icons/hud/hud.png"),
+    HUD_SETTINGS("/assets/oneconfig/textures/gui/icons/hud/settings.png"),
+
+    MOD_BOX("/assets/oneconfig/textures/gui/icons/mod/mod_box.png"),
+    MODS("/assets/oneconfig/textures/gui/icons/mod/mods.png"),
+    PERFORMANCE("/assets/oneconfig/textures/gui/icons/mod/performance.png"),
+
+    DASHBOARD("/assets/oneconfig/textures/gui/icons/dashboard.png"),
+    PREFERENCES("/assets/oneconfig/textures/gui/icons/preferences.png"),
+    PROFILES("/assets/oneconfig/textures/gui/icons/profiles.png"),
+    SCREENSHOT("/assets/oneconfig/textures/gui/icons/screenshot.png"),
+    THEMES("/assets/oneconfig/textures/gui/icons/themes.png"),
+    UPDATES("/assets/oneconfig/textures/gui/icons/updates.png"),
+    ;
+
+    public final String filePath;
+
+    Images(String filePath) {
+        this.filePath = filePath;
+    }
+}
diff --git a/src/main/java/io/polyfrost/oneconfig/test/TestNanoVGGui.java b/src/main/java/io/polyfrost/oneconfig/test/TestNanoVGGui.java
index 8d62cbf..bd77fb0 100644
--- a/src/main/java/io/polyfrost/oneconfig/test/TestNanoVGGui.java
+++ b/src/main/java/io/polyfrost/oneconfig/test/TestNanoVGGui.java
@@ -17,7 +17,6 @@ public class TestNanoVGGui extends GuiScreen {
             //RenderManager.drawRoundedRect(vg, 305, 305, 100, 100, Color.YELLOW.getRGB(), 8);
             //RenderManager.drawString(vg, "Hello!", 80, 20, Color.WHITE.getRGB(), 50, Fonts.MC_REGULAR);
             //RenderManager.drawString(vg, "Hello!", 100, 100, Color.WHITE.getRGB(), 50, Fonts.INTER_BOLD);
-            RenderManager.drawSVGImage(vg, "icons/TestIcon.svg", 10, 10, 100, 100);
             //RenderManager.drawLine(vg, 0, 0, 100, 100, 7, Color.PINK.getRGB());
             //RenderManager.drawCircle(vg, 200, 200, 50, Color.WHITE.getRGB());
             //RenderManager.drawString(vg, (float) (System.nanoTime() - startTime) / 1000000f + "ms", 500, 500, Color.WHITE.getRGB(), 100, Fonts.INTER_BOLD);
diff --git a/src/main/resources/assets/oneconfig/icons/TestIcon.svg b/src/main/resources/assets/oneconfig/icons/TestIcon.svg
deleted file mode 100644
index e69de29..0000000
--- a/src/main/resources/assets/oneconfig/icons/TestIcon.svg
+++ /dev/null
diff --git a/src/main/resources/assets/oneconfig/textures/Theme.png b/src/main/resources/assets/oneconfig/textures/Theme.png
deleted file mode 100644
index df8e3de..0000000
--- a/src/main/resources/assets/oneconfig/textures/Theme.png
+++ /dev/null
diff --git a/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_left.png b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_left.png
new file mode 100644
index 0000000..d705ce7
--- /dev/null
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_left.png
diff --git a/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_right.png b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_right.png
new file mode 100644
index 0000000..1646de1
--- /dev/null
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/arrow_right.png
diff --git a/src/main/resources/assets/oneconfig/textures/arrow.png b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/chevron.png
index 426a17f..426a17f 100644
--- a/src/main/resources/assets/oneconfig/textures/arrow.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/chevron.png
diff --git a/src/main/resources/assets/oneconfig/textures/dropdown_arrow.png b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/dropdown_arrow.png
index 673458d..673458d 100644
--- a/src/main/resources/assets/oneconfig/textures/dropdown_arrow.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/dropdown_arrow.png
diff --git a/src/main/resources/assets/oneconfig/textures/smallUpArrow.png b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/up_arrow.png
index f6723ad..f6723ad 100644
--- a/src/main/resources/assets/oneconfig/textures/smallUpArrow.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/arrows/up_arrow.png
diff --git a/src/main/resources/assets/oneconfig/textures/gui/general/color/color_base.png b/src/main/resources/assets/oneconfig/textures/gui/general/color/color_base.png
new file mode 100644
index 0000000..477c8fa
--- /dev/null
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/color/color_base.png
diff --git a/src/main/resources/assets/oneconfig/textures/colorspectrum.png b/src/main/resources/assets/oneconfig/textures/gui/general/color/colorspectrum.png
index c687a12..c687a12 100644
--- a/src/main/resources/assets/oneconfig/textures/colorspectrum.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/color/colorspectrum.png
diff --git a/src/main/resources/assets/oneconfig/textures/colorwheel.png b/src/main/resources/assets/oneconfig/textures/gui/general/color/colorwheel.png
index f4ebe3b..f4ebe3b 100644
--- a/src/main/resources/assets/oneconfig/textures/colorwheel.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/color/colorwheel.png
diff --git a/src/main/resources/assets/oneconfig/textures/huegradient.png b/src/main/resources/assets/oneconfig/textures/gui/general/color/huegradient.png
index f0ab0a1..f0ab0a1 100644
--- a/src/main/resources/assets/oneconfig/textures/huegradient.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/color/huegradient.png
diff --git a/src/main/resources/assets/oneconfig/textures/check.png b/src/main/resources/assets/oneconfig/textures/gui/general/configs/checkmark.png
index 3069563..3069563 100644
--- a/src/main/resources/assets/oneconfig/textures/check.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/configs/checkmark.png
diff --git a/src/main/resources/assets/oneconfig/textures/love.png b/src/main/resources/assets/oneconfig/textures/gui/general/configs/favorite_active.png
index 39acd3a..39acd3a 100644
--- a/src/main/resources/assets/oneconfig/textures/love.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/configs/favorite_active.png
diff --git a/src/main/resources/assets/oneconfig/textures/love_empty.png b/src/main/resources/assets/oneconfig/textures/gui/general/configs/favorite_inactive.png
index f91d77c..f91d77c 100644
--- a/src/main/resources/assets/oneconfig/textures/love_empty.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/configs/favorite_inactive.png
diff --git a/src/main/resources/assets/oneconfig/textures/eye.png b/src/main/resources/assets/oneconfig/textures/gui/general/configs/hide_eye.png
index 38a5126..38a5126 100644
--- a/src/main/resources/assets/oneconfig/textures/eye.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/configs/hide_eye.png
diff --git a/src/main/resources/assets/oneconfig/textures/gui/general/configs/hide_eye_off.png b/src/main/resources/assets/oneconfig/textures/gui/general/configs/hide_eye_off.png
new file mode 100644
index 0000000..14f3b2a
--- /dev/null
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/configs/hide_eye_off.png
diff --git a/src/main/resources/assets/oneconfig/textures/icon.png b/src/main/resources/assets/oneconfig/textures/gui/general/logo.png
index f0f6e68..f0f6e68 100644
--- a/src/main/resources/assets/oneconfig/textures/icon.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/logo.png
diff --git a/src/main/resources/assets/oneconfig/textures/XCircle.png b/src/main/resources/assets/oneconfig/textures/gui/general/nav/close.png
index 85c82f2..85c82f2 100644
--- a/src/main/resources/assets/oneconfig/textures/XCircle.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/nav/close.png
diff --git a/src/main/resources/assets/oneconfig/textures/share2.png b/src/main/resources/assets/oneconfig/textures/gui/general/nav/launch.png
index 5f1e1ac..5f1e1ac 100644
--- a/src/main/resources/assets/oneconfig/textures/share2.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/nav/launch.png
diff --git a/src/main/resources/assets/oneconfig/textures/Minimise.png b/src/main/resources/assets/oneconfig/textures/gui/general/nav/minimize.png
index dbe5a56..dbe5a56 100644
--- a/src/main/resources/assets/oneconfig/textures/Minimise.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/nav/minimize.png
diff --git a/src/main/resources/assets/oneconfig/textures/search.png b/src/main/resources/assets/oneconfig/textures/gui/general/nav/search.png
index 23a9e05..23a9e05 100644
--- a/src/main/resources/assets/oneconfig/textures/search.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/nav/search.png
diff --git a/src/main/resources/assets/oneconfig/textures/share.png b/src/main/resources/assets/oneconfig/textures/gui/general/nav/share.png
index 67930ef..67930ef 100644
--- a/src/main/resources/assets/oneconfig/textures/share.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/general/nav/share.png
diff --git a/src/main/resources/assets/oneconfig/textures/Dashboard.png b/src/main/resources/assets/oneconfig/textures/gui/icons/dashboard.png
index 179a57d..179a57d 100644
--- a/src/main/resources/assets/oneconfig/textures/Dashboard.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/dashboard.png
diff --git a/src/main/resources/assets/oneconfig/textures/HUD.png b/src/main/resources/assets/oneconfig/textures/gui/icons/hud/hud.png
index 98c052c..98c052c 100644
--- a/src/main/resources/assets/oneconfig/textures/HUD.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/hud/hud.png
diff --git a/src/main/resources/assets/oneconfig/textures/HUDSettings.png b/src/main/resources/assets/oneconfig/textures/gui/icons/hud/settings.png
index 9dd5b5d..9dd5b5d 100644
--- a/src/main/resources/assets/oneconfig/textures/HUDSettings.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/hud/settings.png
diff --git a/src/main/resources/assets/oneconfig/textures/box.png b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/mod_box.png
index 8a7630b..8a7630b 100644
--- a/src/main/resources/assets/oneconfig/textures/box.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/mod_box.png
diff --git a/src/main/resources/assets/oneconfig/textures/Mods.png b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/mods.png
index 07ebd26..07ebd26 100644
--- a/src/main/resources/assets/oneconfig/textures/Mods.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/mods.png
diff --git a/src/main/resources/assets/oneconfig/textures/Performance.png b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/performance.png
index fe64b1d..fe64b1d 100644
--- a/src/main/resources/assets/oneconfig/textures/Performance.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/mod/performance.png
diff --git a/src/main/resources/assets/oneconfig/textures/Settings.png b/src/main/resources/assets/oneconfig/textures/gui/icons/preferences.png
index c8c9888..c8c9888 100644
--- a/src/main/resources/assets/oneconfig/textures/Settings.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/preferences.png
diff --git a/src/main/resources/assets/oneconfig/textures/Profiles.png b/src/main/resources/assets/oneconfig/textures/gui/icons/profiles.png
index f0574e6..f0574e6 100644
--- a/src/main/resources/assets/oneconfig/textures/Profiles.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/profiles.png
diff --git a/src/main/resources/assets/oneconfig/textures/Image.png b/src/main/resources/assets/oneconfig/textures/gui/icons/screenshot.png
index f9a4d25..f9a4d25 100644
--- a/src/main/resources/assets/oneconfig/textures/Image.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/screenshot.png
diff --git a/src/main/resources/assets/oneconfig/font/OneConfig Designs (Copy)/Theme.png b/src/main/resources/assets/oneconfig/textures/gui/icons/themes.png
index df8e3de..df8e3de 100644
--- a/src/main/resources/assets/oneconfig/font/OneConfig Designs (Copy)/Theme.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/themes.png
diff --git a/src/main/resources/assets/oneconfig/textures/Update.png b/src/main/resources/assets/oneconfig/textures/gui/icons/updates.png
index d44220b..d44220b 100644
--- a/src/main/resources/assets/oneconfig/textures/Update.png
+++ b/src/main/resources/assets/oneconfig/textures/gui/icons/updates.png
diff --git a/src/main/resources/assets/oneconfig/textures/hudsettings.png b/src/main/resources/assets/oneconfig/textures/hudsettings.png
deleted file mode 100644
index b901c97..0000000
--- a/src/main/resources/assets/oneconfig/textures/hudsettings.png
+++ /dev/null