diff --git a/README.md b/README.md
index 0148068..6748f45 100644
--- a/README.md
+++ b/README.md
@@ -9,5 +9,6 @@ that Fabilter's Synth One has:
 ## Basic Features
 
 - [x] Waveform
-- [ ] Pitch
-- [ ] Noise 
\ No newline at end of file
+- [ ] Octave Selector
+- [ ] Noise 
+- [ ] Keyboard
\ No newline at end of file
diff --git a/basic.html b/basic.html
index 441d4d7..953eaa1 100644
--- a/basic.html
+++ b/basic.html
@@ -9,16 +9,42 @@
   </head>
   <body>
     <form style="padding: 15px">
-      <input type="radio" id="sinwave" name="wavechoice" value="sine">
-      <label for="sinwave">Sine</label>
-      <input type="radio" id="squarewave" name="wavechoice" value="square" checked>
-      <label for="squarewave">Square</label>
-      <input type="radio" id="triwave" name="wavechoice" value="triangle">
-      <label for="triwave">Triangle</label>
-      <input type="radio" id="sawtoothwave" name="wavechoice" value="sawtooth">
-      <label for="sawtoothwave">Sawtooth</label>
-
+      <fieldset>
+        <legend>Waveform Selection</legend>  
+        <input type="radio" id="sinwave" name="wavechoice" value="sine">
+        <label for="sinwave">Sine</label>
+        <input type="radio" id="squarewave" name="wavechoice" value="square" checked>
+        <label for="squarewave">Square</label>
+        <input type="radio" id="triwave" name="wavechoice" value="triangle">
+        <label for="triwave">Triangle</label>
+        <input type="radio" id="sawtoothwave" name="wavechoice" value="sawtooth">
+        <label for="sawtoothwave">Sawtooth</label>
+      
+      </fieldset>
     </form>
+
+    <form style="padding: 15px">
+      <fieldset>
+        <legend>Octave Selection</legend>  
+        <input type="radio" id="minus2" name="octavechoice" value="-2">
+        <label for="minus2">-2</label>
+        
+        <input type="radio" id="minus1" name="octavechoice" value="-1">
+        <label for="minus1">-1</label>
+        
+        <input type="radio" id="plus0" name="octavechoice" value="0" checked>
+        <label for="plus0">0</label>
+        
+        <input type="radio" id="plus1" name="octavechoice" value="1">
+        <label for="plus1">+1</label>
+        
+        <input type="radio" id="plus2" name="octavechoice" value="2">
+        <label for="plus2">+2</label>
+        
+      </fieldset>
+    </form>
+
+
     <div style="padding: 15px">
       <button id="start">Start</button>
       <button id="stop">Stop</button>
diff --git a/basic.js b/basic.js
index f5e796d..1c1ca62 100644
--- a/basic.js
+++ b/basic.js
@@ -2,6 +2,11 @@ let osc = null;
 let gain = null;
 let selectedWave;
 
+function octavehz(hz, octave) {
+  const val = parseFloat(octave);
+  return hz * 2 ** val;
+}
+
 window.onload = function () {
   const audioContext = new AudioContext();
   // this gets the node for the start butten and adds to it an even listener for click, when clicked the synth will play
@@ -23,12 +28,15 @@ window.onload = function () {
     gainDisplay.textContent = level;
   });
 
-  function handleSelectionChange() {
+  function handleWaveformSelectionChange() {
     let selectedRadioButton = document.querySelector(
       "input[name='wavechoice']:checked"
     );
     if (selectedRadioButton) {
       selectedWave = selectedRadioButton.value;
+      if (osc) {
+        osc.type = selectedWave;
+      }
       console.log(selectedWave);
     } else {
       console.log("No radio button is selected.");
@@ -38,7 +46,7 @@ window.onload = function () {
   document
     .querySelectorAll("input[name='wavechoice']")
     .forEach((radioButton) => {
-      radioButton.addEventListener("change", handleSelectionChange);
+      radioButton.addEventListener("change", handleWaveformSelectionChange);
     });
 
   document.getElementById("start").addEventListener("click", () => {
