CodeStore

Stats Sections

Simple Stats

A minimal form with input fields.

03+
years of experience
15+
experts
HTML
        <div class="p-[2rem] flex lg:flex-row flex-col lg:gap-0 gap-10 justify-between lg:items-center items-stretch rounded-[10px] bg-[var(--basetext)]">
  <!-- 1 -->
  <div class="flex-1 relative border-[#0000004D] md:border-r-[1.5px]">
    <svg class="absolute lg:right-[10%] right-[27%]" width="20" height="22" viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M1.17846 12.4457C2.03227 13.2977 3.41511 13.2963 4.26713 12.4425L7.84194 8.86017L7.85314 19.5433C7.85446 20.808 8.88079 21.8322 10.1455 21.8309C11.4102 21.8296 12.4344 20.8032 12.4331 19.5385L12.4219 8.85663L16.0035 12.4308C16.8574 13.2828 18.2402 13.2814 19.0922 12.4276C19.9442 11.5738 19.9428 10.1909 19.089 9.33891L10.4316 0.699621C10.2609 0.529216 9.98426 0.529505 9.81386 0.700266L1.1746 9.35761C0.323187 10.2116 0.324893 11.5939 1.17846 12.4457Z" fill="#00C71C"/>
    </svg>
    <div class="text-[54px] mx-auto leading-[96px] tracking-[0%] text-center font-[600] font-MonaSans text-[var(--site)]">03+</div>
    <div class="text-[18px] mx-auto leading-[32px] tracking-[0%] text-center font-[400] font-MonaSans text-[black]">years of experience</div>
  </div>

  <!-- 2 -->
  <div class="flex-1 relative">
    <svg class="absolute lg:right-[10%] right-[27%]" width="20" height="22" viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M1.17846 12.4457C2.03227 13.2977 3.41511 13.2963 4.26713 12.4425L7.84194 8.86017L7.85314 19.5433C7.85446 20.808 8.88079 21.8322 10.1455 21.8309C11.4102 21.8296 12.4344 20.8032 12.4331 19.5385L12.4219 8.85663L16.0035 12.4308C16.8574 13.2828 18.2402 13.2814 19.0922 12.4276C19.9442 11.5738 19.9428 10.1909 19.089 9.33891L10.4316 0.699621C10.2609 0.529216 9.98426 0.529505 9.81386 0.700266L1.1746 9.35761C0.323187 10.2116 0.324893 11.5939 1.17846 12.4457Z" fill="#00C71C"/>
    </svg>
    <div class="text-[54px] mx-auto leading-[96px] tracking-[0%] text-center font-[600] font-MonaSans text-[var(--site)]">15+</div>
    <div class="text-[18px] mx-auto leading-[32px] tracking-[0%] text-center font-[400] font-MonaSans text-[black]">experts</div>
  </div>
</div>