로고SEED Design
Foundation/Color

Color System

SEED 색상 시스템은 접근성을 고려하며 제품의 계층, 상태, 브랜드를 표현할 수 있도록 돕습니다.

개요

SEED 색상 시스템은 역할 기반 색상팔레트 색상으로 구성되어 있으며, 모두를 위한 글로벌 접근성 충족을 목표로 설계되었습니다. 이를 통해 인터페이스 내에서 충분한 명도 대비를 보장하고, 명확성과 가시성을 확보할 수 있습니다

역할 기반 색상

역할 기반 색상 시스템은 디자이너와 개발자 모두를 위한 구조화된 색상 구현 방식을 제공합니다.

색상 역할은 인터페이스의 시각적 요소와 기능 사이의 명확한 관계를 설정하여 사용자에게 더 직관적이고 예측 가능한 UI를 제공합니다. 임의의 색상값을 사용하는 대신, 각 색상은 인터페이스 내에서 특정한 목적과 의미를 가집니다.

역할 기반 색상의 강점

  • 접근성
    역할 기반 색상을 사용하면 전체 애플리케이션에서 접근성 표준을 더 쉽게 유지할 수 있습니다. 모든 역할 기반 색상은 의도된 전경/배경의 모든 조합에 대해 충분한 대비를 제공하도록 설계되어 있습니다.
색상 대비
  • 빈틈없는 업데이트
    색상을 업데이트해야 할 때, 이 아닌 의미를 기준으로 업데이트 할 수 있습니다. 동일한 을 가지더라도 의미가 다르다면, 따로 업데이트가 가능해야 합니다. 전체 시스템의 일관성을 보장하면서 지속적으로 UI 색상을 개선할 수 있는 기반을 제공합니다.
시맨틱 분류
  • 테마 적응성
    역할 기반 색상은 라이트 모드와 다크 모드를 포함한 여러 테마를 지원하기 위한 기반을 제공합니다. 특정 색상 대신 역할을 정의함으로써 시스템은 적절한 대비와 시각적 계층 구조를 유지하면서 다양한 테마에 자동으로 적응할 수 있습니다.
테마 적응성

팔레트 색상

팔레트 색상은 역할 기반 색상으로 표현하기 어려운 예외적인 경우에 사용되는 색상입니다.

SEED 팔레트 색상은 적응형 팔레트로 구성되어 기기의 화면 모드(라이트/다크)에 따라 알맞은 명도의 색상이 배정되어 있습니다. 이를 통해 특정 화면 모드를 기준으로 디자인 하더라도, 다른 화면 모드에서도 충분히 인지하기 쉬운 색상을 사용하는 것을 보장합니다.

팔레트

On this page