diff --git a/src/pages/GenerationSettings/index.tsx b/src/pages/GenerationSettings/index.tsx
index 0ff5632..b8ee25c 100644
--- a/src/pages/GenerationSettings/index.tsx
+++ b/src/pages/GenerationSettings/index.tsx
@@ -3,6 +3,8 @@ import { Save, X } from "lucide-solid";
 
 import Button from "../../shared/Button";
 import RangeInput from "../../shared/RangeInput";
+import Dropdown from "../../shared/Dropdown";
+import DropdownItem from "../../shared/DropdownItem";
 
 const GenerationSettings: Component = () => (
   <>
@@ -10,6 +12,14 @@ const GenerationSettings: Component = () => (
     <p class="text-white/50">Some settings might not show up depending on which inference backend is being used.</p>
     <div class="my-4 border-b border-white/5" />
 
+    <Dropdown label="Preset">
+        <DropdownItem>Classic-Pygmalion-6b</DropdownItem>
+        <DropdownItem>Calibrated-Pygmalion-6b</DropdownItem>
+        <DropdownItem>GPU-Pygmalion-6b</DropdownItem>
+        <DropdownItem>DragonSlayer-Pygmalion-6b</DropdownItem>
+        <DropdownItem>Classic-Pygmalion-2.7b</DropdownItem>
+    </Dropdown>
+
     <div class="flex flex-col gap-8">
         <RangeInput 
             label="Max New Tokens"
diff --git a/src/shared/Button.tsx b/src/shared/Button.tsx
index 5b07c37..3758075 100644
--- a/src/shared/Button.tsx
+++ b/src/shared/Button.tsx
@@ -9,6 +9,7 @@ const schemaNameToClass: Record<ButtonSchema, string> = {
 
 const Button: Component<{
   children: JSX.Element;
+  onClick?: JSX.EventHandler<HTMLButtonElement, MouseEvent>;
   schema?: ButtonSchema;
   type?: "submit" | "reset" | "button";
   disabled?: boolean;
@@ -17,6 +18,7 @@ const Button: Component<{
     type={props.type || "button"}
     class={`${schemaNameToClass[props.schema || "primary"]} justify-center`}
     disabled={props.disabled}
+    onClick={props.onClick}
   >
     {props.children}
   </button>
diff --git a/src/shared/Dropdown.tsx b/src/shared/Dropdown.tsx
new file mode 100644
index 0000000..c8b5414
--- /dev/null
+++ b/src/shared/Dropdown.tsx
@@ -0,0 +1,21 @@
+import { Component, JSX, Show, createSignal } from "solid-js";
+
+import Button from "./Button";
+
+import { ChevronDown } from "lucide-solid";
+
+const Dropdown: Component<{ children: JSX.Element, label: string }> = (props) => {
+  const [open, setOpen] = createSignal(false);
+
+  return(
+    <div class="inline-block">
+      <Button onClick={() => {setOpen(!open())}}>
+        <ChevronDown />
+        {props.label}
+      </Button>
+      <Show when={open()}><div class="flex flex-col rounded-md bg-stone-600 drop-shadow-md">{props.children}</div></Show>
+    </div>
+  );
+};
+
+export default Dropdown;
\ No newline at end of file
diff --git a/src/shared/DropdownItem.tsx b/src/shared/DropdownItem.tsx
new file mode 100644
index 0000000..1121e64
--- /dev/null
+++ b/src/shared/DropdownItem.tsx
@@ -0,0 +1,13 @@
+import { Component, JSX, createSignal } from "solid-js";
+
+const DropdownItem: Component<{
+    children: JSX.Element;
+    reference?: any;
+    onClick?: JSX.EventHandler<HTMLAnchorElement, MouseEvent>;
+  }> = (props) => {
+  return (
+    <a class="px-5 py-3 hover:bg-stone-500" href={props.reference} onClick={props.onClick}>{props.children}</a>
+  );
+};
+
+export default DropdownItem;
diff --git a/src/tailwind.css b/src/tailwind.css
index 455b8f2..e8bd77e 100644
--- a/src/tailwind.css
+++ b/src/tailwind.css
@@ -87,4 +87,5 @@
     border: none;
     background: transparent;
   }
+  
 }