diff --git a/webui/src/common/components/Select/Select.jsx b/webui/src/common/components/Select/Select.jsx
new file mode 100644
index 0000000..0eeb6a9
--- /dev/null
+++ b/webui/src/common/components/Select/Select.jsx
@@ -0,0 +1,37 @@
+import React from 'react';
+import { CaretDownIcon } from '@phosphor-icons/react';
+import './styles.sass';
+
+export const Select = ({
+ label,
+ error,
+ options = [],
+ placeholder,
+ className,
+ containerClassName,
+ ...rest
+}) => {
+ return (
+
+ {label &&
}
+
+
+
+
+
+
+ {error &&
{error}
}
+
+ );
+};
\ No newline at end of file
diff --git a/webui/src/common/components/Select/index.js b/webui/src/common/components/Select/index.js
new file mode 100644
index 0000000..ea68f04
--- /dev/null
+++ b/webui/src/common/components/Select/index.js
@@ -0,0 +1 @@
+export { Select as default } from './Select.jsx';
\ No newline at end of file
diff --git a/webui/src/common/components/Select/styles.sass b/webui/src/common/components/Select/styles.sass
new file mode 100644
index 0000000..c3938ab
--- /dev/null
+++ b/webui/src/common/components/Select/styles.sass
@@ -0,0 +1,30 @@
+.field-select
+ appearance: none
+ background: transparent
+ border: 0
+ color: var(--text)
+ font: inherit
+ font-size: 1rem
+ font-weight: 500
+ width: 100%
+ line-height: 1.3
+ outline: none
+ cursor: pointer
+ padding-right: 2.5rem
+
+ &:focus
+ outline: none
+
+ &:disabled
+ opacity: 0.6
+ cursor: not-allowed
+
+.field-control.has-icon .field-icon--right
+ position: absolute
+ right: 1rem
+ top: 50%
+ transform: translateY(-50%)
+ pointer-events: none
+ color: var(--text-dim)
+ display: inline-flex
+ z-index: 1
\ No newline at end of file