diff --git a/tutordash/server/static/img/search.svg b/tutordash/server/static/img/search.svg
new file mode 100644
index 0000000..9c54f05
--- /dev/null
+++ b/tutordash/server/static/img/search.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z" stroke="#717680" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/tutordash/server/static/scss/dash.scss b/tutordash/server/static/scss/dash.scss
index 6b58d26..32b5494 100644
--- a/tutordash/server/static/scss/dash.scss
+++ b/tutordash/server/static/scss/dash.scss
@@ -1,82 +1,227 @@
+$edly-logo-red: #DC1F26;
+$dark-gray: #4a4a4a;
+$gray: #535862;
+$light-gray: #888;
+$black: #181D27;
+$white: #e6f3ff;
+$blue: #1570EF;
+$light-blue: #2E90FA;
+$font-family_1: Arial;
+
 * {
-    box-sizing: border-box;
+	box-sizing: border-box;
+}
+html {
+	height: 100%;
+	margin: 0;
 }
-
 body {
-    font-family: Roboto, sans-serif;
-    height: 100vh;
-    display: flex;
-    flex-direction: column;
+	height: 100%;
+	margin: 0;
+	font-family: $font-family_1;
+	height: 100vh;
 }
-
 .main-container {
-    flex: 1;
-    display: flex;
-    overflow: hidden;
+	display: flex;
+	.sidebar {
+		flex: 0 0 19em;
+		border-right: 1px solid #c4c4c4;
+		box-shadow: 2px 0px #e3e3e3;
+		display: flex;
+		flex-direction: column;
+		height: 55em;
+		.section {
+			display: flex;
+			flex-direction: column;
+			justify-content: flex-start;
+			height: 100%;
+			.header {
+				flex: 0 0 6em;
+				border-bottom: 1px solid #c4c4c4;
+				display: flex;
+				align-items: center;
+				.image {
+					margin-left: 2em;
+					width: 2em;
+					img {
+						width: 100%;
+						height: auto;
+					}
+				}
+				.text {
+					font-size: 2rem;
+					color: $edly-logo-red;
+					font-weight: bold;
+					margin-left: 0.25em;
+				}
+			}
+			.content {
+				display: flex;
+				flex-direction: column;
+				div {
+					flex: 0 0 8em;
+					display: flex;
+					flex-direction: column;
+					justify-content: space-evenly;
+					margin-top: 1em;
+					a {
+						list-style: none;
+						text-decoration: none;
+						color: $dark-gray;
+						font-size: 16px;
+						font-weight: 600;
+						margin: 0em 1em;
+						border-radius: 1em;
+						&:hover {
+							background-color: $white;
+						}
+						li {
+							padding: 0.5em 1em;
+							span {
+								margin-left: 0.5em;
+							}
+                            .sidebar-tab-logo-selected {
+                                filter: invert(39%) sepia(98%) saturate(3884%) hue-rotate(205deg) brightness(95%) contrast(96%);
+                            }
+						}
 
-    .sidebar {
-        width: 250px;
-        border-right: 1px solid #363636;
-        display: flex;
-        flex-direction: column;
-
-        .section {
-            border-bottom: 1px solid #363636;
-            min-height: min-content;
-
-            .header {
-                padding: 8px;
-                border-bottom: 1px solid #363636;
-            }
-
-            .content {
-                padding: 8px;
-
-                ul {
-                    list-style: none;
-
-                    li {
-                        padding: 4px 8px;
-                        cursor: pointer;
-                        border-radius: 4px;
-
-                        &:hover {
-                            background-color: #929292;
+                        .sidebar-tab-selected {
+                            color: $blue;
+                            background-color: $white;
+                            border-radius: inherit;
                         }
-                    }
+					}
+				}
+			}
+		}
+	}
+	.workspace {
+		flex-grow: 1;
+		display: flex;
+		flex-direction: column;
+		.page-title {
+			font-size: 30px;
+			font-weight: 600;
+		}
+		.page-description {
+			font-size: 16px;
+			color: $gray;
+		}
+		.header {
+			display: flex;
+			flex-direction: column;
+			margin: 2em;
+			.info-container {
+				display: flex;
+				flex-direction: row;
+				justify-content: space-between;
+				div {
+					display: flex;
+					flex-direction: column;
+				}
+				.launch-button {
+					display: flex;
+					justify-content: center;
+					button {
+						width: 9em;
+						height: 2.5em;
+						background-color: $light-blue;
+					}
+				}
+			}
+			.search-container {
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+				margin-top: 3em;
 
+                .search-input {
+                    height: 3em;
+                    width: 20em;
+                    border-radius: 10px;
+                    padding-left: 2.5em;
+                    border: 1px solid #c4c4c4;
                 }
-            }
-        }
-    }
 
-    .workspace {
-        flex: 1;
-        padding: 20px;
-        overflow: hidden;
-
-        .header {
-            margin-bottom: 16px;
-            color: #888;
-            font-size: 14px;
-        }
-
-        .content {
-            outline: none;
-            min-height: 200px;
-            height: 100%;
-            overflow: scroll;
-            padding-bottom: 20px; // necessary to display the bottom scrollbar
-
-            pre#tutor-logs {
-                height: calc(100% - 20px); // must match .content padding-bottom to display scrollbar
-            }
-
-            .config {
-                .item form {
-                    display: inline-block;
+                img {
+                    position: relative;
+                    left: 2em;
                 }
-            }
-        }
-    }
+			}
+		}
+		.content {
+			flex-grow: 1;
+			margin: 0em 2em 2em 2em;
+			.installed-plugins-list {
+				border: 1px solid #c4c4c4;
+				border-radius: 1em;
+				display: flex;
+				flex-direction: column;
+				.installed-plugin {
+					display: flex;
+					justify-content: space-between;
+					padding: 1em 2em;
+					border-bottom: 1px solid #c4c4c4;
+					&:last-child {
+						border-bottom: none;
+					}
+					div {
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						.name {
+							font-size: 1.25em;
+							a {
+								text-decoration: none;
+								text-transform: capitalize;
+							}
+						}
+						.author {
+							font-size: 1.15em;
+							color: $gray;
+						}
+						.description {
+							font-size: 1em;
+							color: $black;
+							p {
+								width: 50em;
+								white-space: nowrap;
+								overflow: hidden;
+								text-overflow: ellipsis;
+							}
+						}
+					}
+					.details {
+						width: 30em;
+					}
+					.form-check-input {
+						width: 3.5em;
+						height: 2em;
+					}
+				}
+			}
+		}
+	}
+}
+
+
+.modal {
+	.modal-dialog {
+		max-width: 34em;
+	}
+	.modal-title {
+		color: $black;
+	}
+	.modal-description {
+		color: $gray;
+	}
+	.modal-footer {
+		button {
+			&:last-child {
+				width: 11em;
+				height: 2.5em;
+				background-color: $light-blue;
+			}
+		}
+	}
 }
diff --git a/tutordash/server/templates/index.html b/tutordash/server/templates/index.html
index ec0e338..87fd8c1 100644
--- a/tutordash/server/templates/index.html
+++ b/tutordash/server/templates/index.html
@@ -14,7 +14,7 @@
     <!-- <link rel="stylesheet" href="css/normalize.css"> -->
     <!-- <link rel="stylesheet" href="css/styles.css"> -->
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
+    <!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet"> -->
     <link href="{{ url_for('static', filename='/css/dash.css') }}" rel="stylesheet">
     <!-- TODO self-host -->
     <script src="https://unpkg.com/htmx.org@2.0.3/dist/htmx.min.js"></script>
diff --git a/tutordash/server/templates/installed_plugins.html b/tutordash/server/templates/installed_plugins.html
index 11b42ac..9c0f63f 100644
--- a/tutordash/server/templates/installed_plugins.html
+++ b/tutordash/server/templates/installed_plugins.html
@@ -43,6 +43,6 @@ Running local launch will allow all changes to plugins to take effect. This coul
 {% block scripts %}
 <script>
     document.getElementById('my-plugins').classList.toggle('sidebar-tab-selected');
-    document.querySelectorAll('my-plugins-logo').classList.toggle('sidebar-tab-logo-selected');
+    document.getElementById('my-plugins-logo').classList.toggle('sidebar-tab-logo-selected');
 </script>
 {% endblock %}
diff --git a/tutordash/server/templates/plugin_store.html b/tutordash/server/templates/plugin_store.html
index b61bc00..f76b0f2 100644
--- a/tutordash/server/templates/plugin_store.html
+++ b/tutordash/server/templates/plugin_store.html
@@ -28,6 +28,6 @@
 {% block scripts %}
 <script>
     document.getElementById('plugin-marketplace').classList.toggle('sidebar-tab-selected');
-    document.querySelectorAll('plugin-marketplace-logo').classList.toggle('sidebar-tab-logo-selected');
+    document.getElementById('plugin-marketplace-logo').classList.toggle('sidebar-tab-logo-selected');
 </script>
 {% endblock %}
diff --git a/tutordash/server/templates/workspace_header_general.html b/tutordash/server/templates/workspace_header_general.html
index 669c520..d6c6e34 100644
--- a/tutordash/server/templates/workspace_header_general.html
+++ b/tutordash/server/templates/workspace_header_general.html
@@ -11,7 +11,7 @@
     </div>
 </div>
 <div class="search-container">
-    <i class="fas fa-search search-icon"></i>
+    <img src="{{ url_for('static', filename='/img/search.svg') }}"></img>
     <input id="search-input" type="text" class="form-control search-input" placeholder="Search...">
 </div>
 {% endblock %}
\ No newline at end of file