Toggle navigation
☰
HTML
CSS
Scripting
Database
<!DOCTYPE html> <title>Example</title> <style> .custom-controls { accent-color: #7c3aed; font-family: sans-serif; display: flex; flex-direction: column; gap: 10px; font-size: 16px; } input[type="range"] { width: 160px; } </style> <form class="custom-controls"> <div> <input type="checkbox" id="subscribe" checked> <label for="subscribe">Subscribe to newsletter</label> </div> <div> <input type="radio" id="plan-monthly" name="plan" checked> <label for="plan-monthly">Monthly</label> <input type="radio" id="plan-yearly" name="plan"> <label for="plan-yearly">Yearly</label> </div> <div> <label for="volume">Volume:</label> <input type="range" id="volume" value="75"> </div> <div> <label for="storage">Storage used:</label> <progress id="storage" max="100" value="70">70%</progress> </div> </form>
