Components · Media

Carousel

가로 스크롤 카드 (후기·소개). scroll-snap + 좌우 원형 버튼. 자동 재생 금지 — 사용자 컨트롤만.

Preview

먼저 다녀온 동료들

JH

"일하는 방식이 진짜로 바뀌었습니다."

정현우2기 수료
MS

"혼자 포기했던 것들을 8주 만에 일에 붙였습니다."

이민서3기 수료
SY

"동료가 있으니 진도가 무너지지 않았어요."

박소연4기 수료

Usage

<header class="carousel-head">
  <h2 class="t-h3 carousel-title">먼저 다녀온 동료들</h2>
  <div class="carousel-controls" data-carousel-controls>
    <button class="carousel-btn" data-dir="-1">...</button>
    <button class="carousel-btn" data-dir="1">...</button>
  </div>
</header>
<div class="carousel-rail" data-carousel-rail>
  <article class="t-card t-card-dark">...</article>
  <article class="t-card t-card-light">...</article>
</div>
<!-- landing-example.html 하단 JS 그대로 복사 -->

Rules

DO

  • dark / light 카드 교대 배치 — 시각 리듬.
  • 화살표 버튼은 원형.

DON'T

  • 외부 carousel 라이브러리 추가 금지.
  • 자동 재생 금지.