diff --git a/dropdown-button-active.svg b/dropdown-button-active.svg
new file mode 100644
index 0000000..0ef5732
--- /dev/null
+++ b/dropdown-button-active.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0H15H16V17H15H0V16V1V0ZM1 16H15V1H1V16Z" fill="#808080"/>
+<rect x="1" y="1" width="14" height="15" fill="#C0C0C0"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 7H5V8H6V9H7V10H8V11H9V10H10V9H11V8H12V7Z" fill="black"/>
+</svg>
diff --git a/dropdown-button.svg b/dropdown-button.svg
new file mode 100644
index 0000000..2d0b52b
--- /dev/null
+++ b/dropdown-button.svg
@@ -0,0 +1,8 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15 0H0V1V16H1V1H15V0Z" fill="#DFDFDF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 1H1V15H2V2H14V1H2Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 17H15H0V16H15V0H16V17Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15 1H14V15H1V16H14H15V1Z" fill="#808080"/>
+<rect x="2" y="2" width="12" height="13" fill="#C0C0C0"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 6H4V7H5V8H6V9H7V10H8V9H9V8H10V7H11V6Z" fill="black"/>
+</svg>
diff --git a/style.css b/style.css
index a16aed9..ce774d7 100644
--- a/style.css
+++ b/style.css
@@ -37,8 +37,8 @@
   --border-sunken-inner: inset -2px -2px var(--button-face),
     inset 2px 2px var(--button-shadow);
 
-  /* Checkbox borders flip window-frame and button-shadow */
-  --border-checkbox: inset -1px -1px var(--button-highlight),
+  /* Field borders (checkbox, input, etc) flip window-frame and button-shadow */
+  --border-field: inset -1px -1px var(--button-highlight),
     inset 1px 1px var(--button-shadow), inset -2px -2px var(--button-face),
     inset 2px 2px var(--window-frame);
 }
@@ -262,7 +262,7 @@ input[type="checkbox"] + label::before {
   width: var(--checkbox-width);
   height: var(--checkbox-width);
   background: var(--button-highlight);
-  box-shadow: var(--border-checkbox);
+  box-shadow: var(--border-field);
   margin-right: var(--radio-label-spacing);
 }
 
@@ -290,3 +290,27 @@ input[type="checkbox"][disabled] + label::before {
 input[type="checkbox"][disabled]:checked + label::after {
   background: url("./checkmark-disabled.svg");
 }
+
+select {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  border: none;
+  position: relative;
+  padding: 3px 4px;
+  box-shadow: var(--border-field);
+  max-width: 120px;
+  background-color: var(--button-highlight);
+  height: 21px;
+  background-image: url("./dropdown-button.svg");
+  background-position: top 2px right 2px;
+  background-repeat: no-repeat;
+}
+
+select:focus {
+  outline: none;
+}
+
+select:active {
+  background-image: url("./dropdown-button-active.svg");
+}