Desktop Design

Mobile Design

Interactive pricing component

<div class="header">
        <img src="./images/pattern-circles.svg" alt="" class="bg-circles">
        <h1>Simple, traffic-based pricing</h1>
        <p>Sign-up for our 30-day trial.</p>
        <p>No credit card required.</p>
      </div>

<div class="title">
            <h4>100K Pageviews</h4>
            <p class="price">
              <span>$16.00</span>
              &nbsp;&nbsp;&nbsp;/month
            </p>
          </div>

<label class="name">Monthly Billing</label>

<label class="name">
            Yearly Billing
            <span>-25%</span>
          </label>

<div class="attribution">
      Challenge by
      <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">
        Frontend Mentor
      </a>
      . Coded by
      <a href="#">uiGuys</a>
      .
    </div>

Please log in to post a comment

Community feedback

Responsive Interactive pricing component

Solution retrospective

Please log in to post a comment

Community feedback

Join our Discord community