Forms

Accessible and customizable form components for user input.

<div class="ethio-form-group">
    <label class="ethio-form-label">Full Name</label>
    <input type="text" class="ethio-form-input" placeholder="Enter your name">
  </div>

<div class="ethio-form-group">
    <label class="ethio-form-label">Message</label>
    <textarea class="ethio-form-textarea" rows="4"></textarea>
  </div>

<!-- Checkbox -->
  <div class="ethio-form-check">
    <input type="checkbox" class="ethio-checkbox" id="subscribe">
    <label for="subscribe">Subscribe</label>
  </div>
  
  <!-- Radio -->
  <div class="ethio-form-check">
    <input type="radio" class="ethio-radio" id="option1" name="options">
    <label for="option1">Option One</label>
  </div>

<div class="ethio-form-group">
    <label class="ethio-form-label">Country</label>
    <select class="ethio-form-select">
      <option>Select a country</option>
      <option>Ethiopia</option>
    </select>
  </div>