switches

Install Progress Toggle

#switch#toggle#install#download#progress#animation#css-only#dark-mode

의존성: 없음 (순수 HTML/CSS/JS)
추가일: 2026-06-11
출처: 원본 보기 ↗

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Install Progress Toggle</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="container">
    <label class="label">
      <input type="checkbox" class="input" />
      <span class="circle">
        <svg class="icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
          <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 19V5m0 14-4-4m4 4 4-4"></path>
        </svg>
        <div class="square"></div>
      </span>
      <p class="title">Download</p>
      <p class="title">Open</p>
    </label>
  </div>
</body>
</html>