Tai Phan Mem Pitch Shifter - Html5 -

body background: linear-gradient(145deg, #101418 0%, #0b0e14 100%); font-family: 'Segoe UI', 'Inter', system-ui, -apple-system, 'Roboto', sans-serif; display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; padding: 24px;

.st-btn:active transform: scale(0.96);

.btn-danger background: #7f1a1a; border-bottom-color: #ef4444; tai phan mem pitch shifter - html5

<div class="pitch-area"> <div class="knob-label"> <span>🔽 PITCH SHIFT</span> <span class="pitch-value" id="pitchDisplay">0.00 semitones</span> </div> <input type="range" id="pitchSlider" min="-12" max="12" step="0.1" value="0"> <div class="semitone-buttons"> <button class="st-btn" data-shift="-2">-2 sem</button> <button class="st-btn" data-shift="-1">-1 sem</button> <button class="st-btn reset" data-shift="0">⟳ Reset</button> <button class="st-btn" data-shift="1">+1 sem</button> <button class="st-btn" data-shift="2">+2 sem</button> <button class="st-btn" data-shift="5">+5 sem</button> <button class="st-btn" data-shift="-5">-5 sem</button> </div> <div style="font-size: 0.7rem; text-align: center; margin-top: 12px; color:#6b7280"> ⚡ Pitch factor: <span id="pitchFactorSpan">1.000</span> </div> </div> body background: linear-gradient(145deg