diff --git a/static/koboldai.css b/static/koboldai.css
index 63ecfa57..74dea16c 100644
--- a/static/koboldai.css
+++ b/static/koboldai.css
@@ -1331,9 +1331,10 @@ body {
 	margin: auto auto auto auto;
 	display: flex;
 	flex-direction: column;
+	color: var(--flyout_text);
 }
 
-.delete_option_icon {
+.option_icon {
 	font-size: 1.2em !important;
 }
 
diff --git a/static/koboldai.js b/static/koboldai.js
index c6ba761e..67bbbcdb 100644
--- a/static/koboldai.js
+++ b/static/koboldai.js
@@ -317,10 +317,12 @@ function create_options(action) {
 			iconcell.classList.add("sequnce_icon");
 			var icon = document.createElement("span");
 			icon.id = "Pin_"+i;
-			icon.classList.add("oi");
-			icon.setAttribute('data-glyph', "loop-circular");
+			icon.classList.add("material-icons-outlined");
+			icon.classList.add("option_icon");
+			icon.classList.add("cursor");
+			icon.textContent = "cached";
 			iconcell.append(icon);
-			delete_icon = $e("span", iconcell, {"classes": ["material-icons-outlined", "cursor", 'delete_option_icon'], 
+			delete_icon = $e("span", iconcell, {"classes": ["material-icons-outlined", "cursor", 'option_icon'], 
 												"tooltip": "Delete Option", 'option_id': i,
 												'option_chunk': action.id, 'textContent': 'delete'});
 			delete_icon.onclick = function () {
@@ -353,8 +355,10 @@ function create_options(action) {
 			iconcell.classList.add("sequnce_icon");
 			var icon = document.createElement("span");
 			icon.id = "Pin_"+i;
-			icon.classList.add("oi");
-			icon.setAttribute('data-glyph', "pin");
+			icon.classList.add("material-icons-outlined");
+			icon.classList.add("option_icon");
+			icon.classList.add("cursor");
+			icon.textContent = "push_pin";
 			if (!(item.Pinned)) {
 				icon.setAttribute('style', "filter: brightness(50%);");
 			}