diff --git a/src/App.js b/src/App.js
index 8b8f735..17401e9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -30,6 +30,15 @@ import i18n from "i18next";
 import languageImg from "./images/language.png";
 import Arrow from './images/arrow.svg'
 
+import SvgIcon from '@mui/material/SvgIcon';
+
+function CustomIcon(props) {
+  return (
+    <SvgIcon viewBox="0 0 24 24" {...props}>
+      <path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
+    </SvgIcon>
+  );
+}
 
 class App extends React.Component {
   constructor(props) {
@@ -287,6 +296,7 @@ class App extends React.Component {
               className="language-select"
               value={language}
               label={t("language")}
+              IconComponent={CustomIcon}
               onChange={(e) => {
                 let lang = e.target.value;
                 this.setState({
diff --git a/src/Components/pane/index.js b/src/Components/pane/index.js
index d20f9ab..47cd46a 100644
--- a/src/Components/pane/index.js
+++ b/src/Components/pane/index.js
@@ -16,6 +16,15 @@ import verticalChecked from "../../images/vertical-button-checked.png";
 import verticalButton from "../../images/vertical-button.png";
 import modeSelectPng from "../../images/mode-select.png";
 import { useTranslation } from "react-i18next";
+import SvgIcon from '@mui/material/SvgIcon';
+
+function CustomIcon(props) {
+  return (
+    <SvgIcon viewBox="0 0 24 24" {...props}>
+      <path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
+    </SvgIcon>
+  );
+}
 
 var deviceConfigs = [
 	{
@@ -74,6 +83,7 @@ function Pane(props) {
 				id="mode-select"
 				value={mode}
 				onChange={(e) => modeChange(e)}
+				IconComponent={CustomIcon}
 				sx={{
 					width: "100%",
 					height: '42px',
@@ -88,7 +98,7 @@ function Pane(props) {
 					'&.Mui-focused': {
 						borderColor: '#757575',
 						'&.MuiOutlinedInput-notchedOutline': {
-							borderColor: '#757575',
+							borderColor: '#757575 !important',
 						},
     				},
 				}}
diff --git a/src/images/svg/arrow.jsx b/src/images/svg/arrow.jsx
new file mode 100644
index 0000000..ce57bdf
--- /dev/null
+++ b/src/images/svg/arrow.jsx
@@ -0,0 +1,10 @@
+import SvgIcon from '@mui/material/SvgIcon';
+import React from "react";
+
+export function ArrowIcon(props) {
+    return (
+      <SvgIcon viewBox="0 0 24 24" {...props}>
+        <path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
+      </SvgIcon>
+    );
+  }
\ No newline at end of file