Mint 패널 키트 — 제목 바 패널과 버튼

모서리 반경을 거의 다 거둬들인 플랫 디자인입니다. 밝은 플랫 계열은 캐주얼을 겨냥하기에 20px 모서리와 알약형 버튼을 쓰지만, 이쪽은 8px와 정사각 버튼입니다. 전략 화면은 대부분이 줄이고 넉넉한 반경은 숫자가 들어갈 폭을 그대로 잡아먹기 때문입니다. 외곽선도 음영도 어디에도 없고 깊이는 겹친 세 번의 그림자뿐입니다.

nine-slice 패널 두 장 — 모서리 8 px의 제목 바가 있는 창 프레임과 모서리 6 px의 들어간 내부 프레임 — 이면 메뉴에 필요한 거의 모든 상자를 감당합니다. 대화 상자, 인벤토리 그리드, 목록 바탕, 툴팁, 스탯 패널. 제목 띠가 패널 위쪽에 붙박이로 들어 있어, 대화 상자 헤더에 두 번째 스프라이트도 수동 정렬도 필요 없습니다.모서리는 절대 확대되지 않고 가운데는 플랫 채움이라, 둘 다 어떤 크기로도 깔끔하게 늘어납니다.

패널 위에는 각진 모서리 버튼의 네 상태가 놓입니다. 기본, 호버, 눌림, 비활성. 모두 같은 120×36 기반에 모서리 6 px로 그렸기에, 버튼 위젯 하나에서 텍스처만 바꾸면 사각형을 옮기지 않고도 상호작용 한 바퀴가 갖춰집니다. 눌림 상태는 단순히 어두워지는 대신 면을 두 픽셀 내리고 위쪽 하이라이트를 없앱니다. 그것이 색만 바뀐 것이 아니라 실제로 눌렸다는 감각을 만듭니다.

모든 것이 두 벌로 제공됩니다. SVG 소스는 키트를 실제로 그린 파일 그 자체입니다. 열어서 청회색 여섯 톤이나 민트 그린 강조색 하나를 바꾸고 다시 내보내세요. PNG 내보내기는 플랫하고 투명하며 비트맵을 원하는 엔진을 위해 1x, 2x, 4x로 미리 확대해 두었고, 알파 사전 곱셈도 스프라이트 밖으로 삐져나온 구운 그림자도 없습니다.

크리에이티브 커먼즈 제로 1.0 — 퍼블릭 도메인. 출처 표기도 필요 없습니다. 전문 보기 · 실제로 무슨 뜻인지