개발자 도구·터미널·인프라 화면을 위한 다크 퍼스트 시스템이다. 모노스페이스와 네온 악센트로 CLI와 대시보드의 기술적인 인상을 만든다.
커맨드 실행과 배포 액션의 위계를 네온 포인트로 구분한다.
한 옵션의 켜짐과 꺼짐을 눌림 위치와 색면으로 표시한다.
라벨 대신 아이콘을 쓰는 액션에 필수 접근성 이름을 연결한다.
설정과 확인을 현재 터미널 맥락 위의 집중된 경계에 둔다.
결과가 큰 작업 전에 짧은 설명과 확인 액션을 표시한다.
저장소와 endpoint처럼 짧은 기술 값을 명확한 경계 안에 받는다.
릴리스 노트와 incident 메모를 여러 줄의 입력 공간에 담는다.
환경과 region처럼 고정된 옵션을 공간 효율적으로 제공한다.
검색어 입력과 지우기 동작을 하나의 명확한 입력 블록에 둔다.
긴 선택 목록을 검색하고 키보드로 이동해 값을 고른다.
기존 값을 고르거나 같은 영역에서 새 값을 만든다.
라벨과 도움말, 오류를 하나의 입력 문맥으로 묶는다.
서로 독립적인 여러 필터 조건을 동시에 선택한다.
상호 배타적인 집합 안에서 한 옵션의 선택 상태를 표현한다.
짧은 단일 선택 집합의 범위와 이름을 명확히 묶는다.
실시간 tail처럼 즉시 적용되는 이진 설정을 드러낸다.
필터와 짧은 선택값을 네온 경계의 라벨 조각으로 전환한다.
한 영역의 표시 방식을 서로 배타적인 버튼 묶음으로 바꾼다.
긴 설명을 제목별로 접고 펼쳐 한 화면의 길이를 줄인다.
관련 패널을 키보드와 클릭으로 전환한다.
현재 위치까지의 상위 경로를 링크 목록으로 표시한다.
긴 목록의 현재 페이지와 이전, 다음 이동을 표시한다.
Latency warning
장애, 지연과 설정 변경처럼 계속 확인해야 하는 메시지를 표시한다.
서비스 상태와 리소스 분류를 작은 모노스페이스 라벨로 표시한다.
서버와 연결의 상태를 작은 glow 신호로 표시한다.
시간과 레벨, 출처를 고정된 리듬으로 정렬해 로그를 읽게 한다.
로그와 리소스를 불러오는 동안 콘텐츠 자리를 표시한다.
짧은 명령 실행과 데이터 로딩 상태를 회전 표시로 알린다.
작업 완료 비율을 네온 경계의 트랙과 채움으로 표시한다.
정해진 범위 안의 현재 측정값을 라벨과 함께 표시한다.
작업 결과를 화면 오른쪽 위에 일정 시간 표시한다.
사용자, 노드와 실행 주체를 이니셜 또는 이미지로 식별한다.
여러 사용자와 실행 주체를 겹친 식별자로 압축한다.
ap-northeast-2
healthy · 24ms
노드 이름, 상태와 세부 정보를 하나의 기술 패널로 구성한다.
Requests
24.8K
+8%
요청 수처럼 중요한 단일 지표와 변화량을 함께 표시한다.
상시 노출하기 부담스러운 짧은 기술 설명을 보강한다.
단축키와 키 입력을 물리 키 모양으로 표시한다.
관련 리소스를 어두운 패널과 네온 경계 안에 묶는다.
상태 라벨과 컨트롤을 한 축에 일관된 간격으로 배치한다.
리소스 카드와 관측 패널을 일정한 열과 간격에 배치한다.
콘텐츠 묶음 사이를 1px 선과 선택적 라벨로 나눈다.
Nothing here
The next query appears here.
콘텐츠가 없는 이유와 다음 액션을 한 블록에서 안내한다.
읽기 중심 데이터를 시맨틱 표와 네온 경계의 셀 경계로 구성한다.
폭이 큰 업무 데이터를 고정 열과 스크롤 영역에 배치한다.
피드와 일정 목록에서 날짜별 콘텐츠 경계를 표시한다.
용어와 값을 한 쌍씩 정렬해 상세 정보를 읽기 쉽게 만든다.
node-01
runtime team
84K
Reach
92%
Rate
한 대상의 이름과 여러 지표를 하나의 기술 카드에 담는다.
제공: Orbit
Sends query signals.
외부 서비스 설명과 연결 상태 액션을 함께 표시한다.
일정 제목, 시간과 참여자를 한 카드로 묶는다.
명령을 검색하고 단축키와 함께 실행하는 집중된 흐름을 만든다.
$ run
명령과 출력 로그를 하나의 콘솔형 패널에 유지한다.
시간에 따른 여러 값의 변화를 네온 경계의 선으로 비교한다.
범주별 크기를 네온 경계의 막대와 명시적 경계로 비교한다.
전체에서 각 항목이 차지하는 비율을 원형 분포로 표시한다.
작은 카드 안에서 최근 값의 방향만 빠르게 표시한다.
단일 완료 비율을 반원과 큰 숫자로 표시한다.
행과 열이 만나는 값의 밀도를 한 색의 농도로 표시한다.
부분과 전체의 비율을 한 줄 누적 막대로 비교한다.
여러 지표의 균형을 다각형으로 비교한다.
여러 비율을 크기가 다른 동심원에 배치한다.
증가와 감소가 최종 합계에 미치는 영향을 단계별로 표시한다.
범주별 값을 가는 선과 네모난 점으로 비교한다.