탐색Component크립토 스왑 위젯 — 라이트 모드 주문 카드와 가격 차트

1 / 1

연회색 배경 위에 토큰 스왑 주문 카드 세 장(빈 상태·입력 상태·다른 토큰 조합), 기간 탭과 툴팁이 있는 초록 라인 차트, 체크 아이콘의 거래 완료 카드가 배치된 컴포넌트 구성이다.

Component

크립토 스왑 위젯 — 라이트 모드 주문 카드와 가격 차트

2023-05-24 · 이미지 1

AI 분석

토큰 스왑 주문 카드, 가격 차트, 거래 완료 상태를 연회색 캔버스 위에 모아 보여주는 라이트 모드 컴포넌트 구성이다.

연회색 캔버스 위에 둥근 모서리의 흰 카드 여러 장을 비대칭으로 배치해 스왑 위젯의 여러 상태를 한 화면에서 보여준다. 검정에 가까운 산세리프 숫자를 크게 쓰고 보조 정보는 회색으로 낮춰 위계를 만들며, 색은 토큰 아이콘과 초록 차트 선, 완료 화면의 은은한 초록 그라데이션에만 쓴다. Market·Limit 탭, 토큰 선택 필 드롭다운, Max·50%·25% 칩, 가운데 스왑 전환 버튼, 비활성과 활성 상태의 Review order 버튼, 기간 탭과 툴팁이 달린 라인 차트, 체크 아이콘의 완료 상태가 핵심 컴포넌트다. 입력 전후 상태 변화와 수수료 표기 방식까지 담고 있어 깔끔한 거래 폼과 스왑 UI 설계 참고로 유용하다.

minimal · light-mode · soft-gradient