Object style

디자인 요소의 일관성을 유지하기 위해 미리 정의된 스타일 세트를 의미합니다. 도형, 이미지 등 다양한 객체에 적용할 수 있는 속성을 포함하며 특정 모양이나 효과는 의도를 전달하거나 상호 작용에 대한 단서를 제공하는 데 사용됩니다.

Radius

Radius는 사이트 전반에 적용이 되며 4배수의 값만 지정하여 사용합니다. Round는 구성 요소의 높이 또는 너비의 50%인 직경을 가진 원형 모양에 사용됩니다.

Shadow

그림자 효과는 입체감을 주고, 시각적인 계층 구조를 명확하게 하여 사용자가 어떤 요소를 우선적으로 상호작용해야 하는지 직관적으로 알 수 있게 합니다. 색상, 흐림 정도, 방향, 거리 등을 설정하여 다양한 효과를 만들 수 있으며, 일관된 디자인을 유지하는 데 중요한 역할을 합니다.

Token	Value
shadow-green-100	0px 4px 8px 0px rgba(77, 172, 39, 0.40);모바일 하단 navigation 마이 아이콘
shadow-gray-100	0px 5px 10px 0px rgba(0, 0, 0, 0.10);MO/PC 탑버튼과 상품상세 탭의 그림자입니다.
shadow-gray-200	0px 20px 40px 0px rgba(0, 0, 0, 0.10);도서상세 상품썸네일 그림자입니다.

Token	Value	Usage
shadow-green-100	0px 4px 8px 0px rgba(77, 172, 39, 0.40);	모바일 하단 navigation 마이 아이콘
shadow-gray-100	0px 5px 10px 0px rgba(0, 0, 0, 0.10);	MO/PC 탑버튼과 상품상세 탭의 그림자입니다.
shadow-gray-200	0px 20px 40px 0px rgba(0, 0, 0, 0.10);	도서상세 상품썸네일 그림자입니다.