개발·AI, 디자인·크리에이티브

Atomize

디자인 토큰 슬라이더를 움직이면 버튼과 카드의 둥글기와 컬러가 즉시 변하는 실시간 컴포넌트 뷰어로 디자인 시스템의 위력을 과시합니다.

섹션 이미지 5

원본 사이트를 직접 캡처한 장면입니다. 이미지를 눌러 전체 높이로 살펴보세요.

섹션 종류

5개 이미지

디자인 연구를 위한 화면 기록입니다. 이미지에 포함된 브랜드·사진·서체 등 원본 소재의 프로젝트 사용 조건은 별도로 확인하세요.

히어로(리액트와 피그마를 완벽 동기화하는 가장 진보된 디자인 시스템) → 컴포넌트 라이브러리 및 디자인 토큰 실시간 조작 테스터 → 오토레이아웃 및 다크모드 대응 프리뷰 → 다운로드 CTA

디자인 토큰 슬라이더를 움직이면 버튼과 카드의 둥글기와 컬러가 즉시 변하는 실시간 컴포넌트 뷰어로 디자인 시스템의 위력을 과시합니다.

디자인 시스템, UI 컴포넌트 라이브러리 및 피그마 플러그인 웹사이트에서 실시간 토큰 테스터를 배치하는 훌륭한 레퍼런스입니다.

아직 실제 프로젝트에 적용하지 않았습니다.

데스크톱 1440×900 CSS 뷰포트에서 홈페이지 전 구역을 순차 조사 및 직접 촬영.

공개 홈페이지 화면 기록 및 디자인 연구 목적