잎사귀, 꼭지, 알맹이로 이뤄진 목록. HTML로는 기본적으로 다음과 같이 구조화할 수 있다.

<div class="cherry">
  <div class="leaf"></div>
  <div class="twig"></div>
  <div class="kernel"></div>
</div>

잎사귀가 두 개라면 잎사귀는 항목에서 목록이 된다.

<div class="cherry">
  <div class="leaf">
    <div class="leaf-left"></div>
    <div class="leaf-right"></div>
  </div>
  <div class="twig"></div>
  <div class="kernel"></div>
</div>

알맹이에 빛이 비춘다면…

<div class="cherry">
  <div class="leaf">
    <div class="leaf-left"></div>
    <div class="leaf-right"></div>
  </div>
  <div class="twig"></div>
  <div class="kernel">
    <div class="kernal-light"></div>
  </div>
</div>

• 체리 재배