GitHub 2026 브랜드 가이드라인 - 브랜드 속성, 로고, 서브 브랜딩, 코브랜딩, 일러스트레이션, 색상, 마스코트, 아이콘, 다이어그램, 타이포그래피, 레이아웃 및 체험 디자인을 포괄하는 포괄적인 시각적 아이덴티티 시스템
빠른 탐색
태그
슬라이드 공유
GitHub 2026 브랜드 가이드라인 - 브랜드 속성, 로고, 서브 브랜딩, 코브랜딩, 일러스트레이션, 색상, 마스코트, 아이콘, 다이어그램, 타이포그래피, 레이아웃 및 체험 디자인을 포괄하는 포괄적인 시각적 아이덴티티 시스템
레이아웃, 주요 콘텐츠 및 시각적 요소를 포함한 각 슬라이드 페이지의 상세 보기.
GitHub 로고, 2026 Brand Guidelines 제목, 제품 아이콘이 있는 3D 아이소메트릭 녹색 큐브, Mona 마스코트가 있는 표지
밝은 그라데이션 배경에 큰 검은색 타이포그래피가 왼쪽에 있고, 3D 일러스트레이션이 오른쪽에 있음
4개의 섹션: 브랜드 비주얼 전략, 비주얼 및 일러스트레이션, 그래픽 장치, 이벤트 및 체험
녹색 선으로 구분된 4분면이 있는 어두운 배경
섹션 제목: 브랜드 속성
전체 어두운 배경에 왼쪽 하단에 큰 흰색 텍스트
아이콘이 있는 5가지 브랜드 속성: Nerdy, Confident, Authentic, Imaginative, Empathetic
분할: 왼쪽에 소개 텍스트, 오른쪽에 어두운 배경에 5개의 속성 행
속성 적용 방법: GitHub Universe, Copilot, Shop, Enterprise 컨텍스트
속성 태그와 설명이 있는 4개의 사진 카드
Nerdy 속성: 열정적, 엔지니어링, 기술적 (예시 포함)
왼쪽 상단에 속성 정의, 전체 너비에 걸쳐 있는 4개의 사진 예시
Copy: 정확하고 기술적임. Design: 고정폭, 그리드. Experiences: 심층적인 콘텐츠, 워크숍
분할: 왼쪽에 속성 소개, 오른쪽에 3개의 지침 섹션
Confident 속성: 야심차고, 신뢰할 수 있고, 지능적임 (예시 포함)
왼쪽 상단에 속성 정의, 5개의 사진/일러스트레이션 예시
Copy: 명확하고 권위 있음. Design: 다채롭고 인상적임. Experiences: 약속을 이행함
분할: 왼쪽에 속성 소개, 오른쪽에 3개의 지침 섹션
Authentic 속성: 신뢰할 수 있고, 활기차고, 밝음 (예시 포함)
왼쪽 상단에 속성 정의, 5개의 사진 예시
카피: 대화체, 평이한 어조. 디자인: 깔끔하고 표현력이 풍부함. 경험: 상호 작용을 장려함
분할: 속성 소개 왼쪽, 세 가지 지침 섹션 오른쪽
상상력이 풍부한 속성: 장난기 있고, 변혁적이며, 적응력이 뛰어남 (예시 포함)
속성 정의 왼쪽 상단, 세 개의 큰 사진
카피: 열망을 불러일으킴. 디자인: 관습을 타파함. 경험: 공간을 변화시킴
분할: 속성 소개 왼쪽, 세 가지 지침 섹션 오른쪽
공감적인 속성: 접근 가능하고, 상호 연결되어 있으며, 실용적임 (예시 포함)
속성 정의 왼쪽 상단, 사진 및 색상 견본
카피: 접근성이 최우선. 디자인: 대비, 맥락. 경험: 명확한 길 찾기, 다양한 연사
분할: 속성 소개 왼쪽, 세 가지 지침 섹션 오른쪽
섹션 제목: 로고
전체 어두운 배경에 왼쪽 하단에 큰 흰색 텍스트, PG 15
기본 로고는 Invertocat (Mona the Octocat)입니다. 25% 여백 규칙
분할: 간격 다이어그램과 함께 왼쪽 설명, 큰 Invertocat 마크 오른쪽
외부용 전체 GitHub 로고 (Invertocat + 워드마크). 높이 50% 여백
왼쪽 설명, 중앙에 큰 GitHub 워드마크 잠금
로고 배치: 눈에 띄지만 지배적이지 않아야 합니다. 전체 로고타입, 단독 Invertocat, 모서리 배치
그리드 오버레이가 있는 세 가지 배치 예시
기본/보조/액센트 색상으로 밝은색, 밝은 회색, 어두운색 테마에 걸쳐 있는 로고 색상 변형
9가지 로고 색상 변형을 보여주는 3열 그리드
금지 사항: 자르기, 오버레이, 컬러 로고, 비율 변경, 효과, 회전
빨간색 금지 아이콘이 있는 6가지 금지 예시
태그라인 사용법: 독립형 및 Invertocat Lockup과 함께 사용. 전략적 배치만 가능
왼쪽 설명, 오른쪽 여러 태그라인 레이아웃 변형
섹션 제목: 서브 브랜딩
전체 어두운 배경에 왼쪽 하단에 큰 흰색 텍스트, PG 23
브랜드 마크 계층 구조: GitHub 로고타입 (기본), 서브 브랜드 Lockup, 플랫폼 내 제품 아이콘
왼쪽 설명, 브랜드 마크, Lockup (Advanced Security, Copilot, Actions), 오른쪽 제품 아이콘 그리드
Lockup 유연성: Invertocat만, 서브 브랜드 Lockup, 상황에 따른 확장된 Lockup
제품 UI 예시가 있는 3열 비교
동심원 계층 구조: GitHub Core, 서브 브랜드, 이벤트. 모든 제품 Lockup 변형 표시
왼쪽 벤 다이어그램, 오른쪽 4열 Lockup 시스템
모든 제품에 대한 서브 브랜드 Lockup (Mona Sans Display Medium) 및 확장된 Lockup 변형
Security, Copilot, Spark, Enterprise, Actions, Issues에 대한 Lockup을 보여주는 2단 레이아웃
의사 결정 트리: 이벤트? GitHub 내 제품? 독립 실행형 Copilot/Security? 제품 마케팅?
YES/NO 분기가 있는 수직 순서도
3D 등각 투영 녹색 큐브와 Copilot 마스코트가 있는 Copilot 섹션 히어로
전체 너비의 3D 등각 투영 일러스트레이션이 있는 큰 Copilot 제목, PG 30
Copilot Purple (#8534F3), 제품 Lockup, 아이콘 변형, 3D 마스코트 일러스트레이션
왼쪽 설명 및 색상 견본, 오른쪽 Lockup/아이콘/일러스트레이션, PG 32
보라색 디더링 텍스처, 핵심 테마 폴백, 80/10/5/5 색상 비율
디더링, 핵심 테마, 노브랜딩 접근 방식을 보여주는 다중 예제 레이아웃, PG 33
출시를 위한 주변 안정적 (디더 + 스크린샷) vs 강렬 (키 아트 일러스트레이션)
나란히 비교, PG 34
3D 아이소메트릭 녹색 큐브, 파란색 방패 아이콘이 있는 보안 섹션
3D 일러스트레이션이 있는 큰 보안 제목, PG 35
Security Blue (#3094FF), 제품 잠금, 방패 아이콘 변형, 3D 일러스트레이션
설명 및 파란색 견본 왼쪽, 잠금/아이콘/일러스트레이션 오른쪽, PG 37
파란색 디더링 텍스처, 핵심 테마 폴백, 코드 스캔 UI 예제
파란색 디더링 및 노브랜딩 접근 방식을 보여주는 다중 예제, PG 38
섹션 제목: 공동 브랜딩
전체 어두운 배경에 큰 흰색 텍스트, PG 39
기본 (아이콘 + 구분 기호), 스택형, 가로 잠금. 동일한 광학 크기
Microsoft + GitHub 로고가 있는 세 가지 잠금 변형, PG 40
금지 사항: 확장 잠금, 오버레이, 하위 브랜딩, 마스코트, 스태킹, Universe 로고
빨간색 아이콘이 있는 6가지 금지 예시, PG 41
6가지 공동 브랜딩 FAQ: 소셜 미디어, 파트너십 언어, 프레젠테이션, 제품 이름, 랜딩 페이지, 판촉물
Q&A 목록 형식, PG 42
섹션 제목: 일러스트레이션
전체 어두운 배경에 큰 흰색 텍스트, PG 43
세 가지 스타일: 주요 일러스트레이션 (3D), 기여도 그래프 (창의적 추상화), 텍스처 (비트맵)
세 개의 동일한 열에 예시, PG 44
세밀하고, 3D, 등각도. 제품 아이콘, 디더링, 마스코트로 기여도 그래프를 돋보이게 합니다.
왼쪽 설명, 오른쪽 큰 3D 일러스트레이션, PG 45
다양한 배열로 Mona, Duckie, 녹색 큐브를 활용한 유연한 구성
6개의 일러스트레이션 변형 그리드, PG 46
기여도 그래프 UI를 브랜드 비주얼로 변환. 녹색/회색/분홍색 사각형, 마스코트
주석이 달린 전체 일러스트레이션, PG 47
금지 사항: 격리, 배경으로 사용, 과도한 확대, 디더링과 혼합. 권장 사항: 애니메이션, 인쇄
체크 표시/금지 표시가 있는 6가지 사용 예, PG 48
배경 및 표면 패턴을 위한 더 단순한 디더링 텍스처
왼쪽 설명, 오른쪽 두 가지 적용 예시, PG 49
6가지 디더링 패턴: 원, 히트맵, 그라데이션, 반원, 웨이브, 타원
2x3 그리드의 6가지 텍스처 예시, PG 50
두 가지 색조 텍스처: 대담한 삼각/보색 쌍과 단색 옵션
상단 대담한 두 가지 색조 행, 하단 단색 열, PG 51
섹션 제목: 색상
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 52
녹색 액센트가 있는 중립적인 브랜드. 기본 (중립 + 녹색), 보조 (6가지 색상 계열)
왼쪽 설명, 중앙 기본 팔레트, 오른쪽 보조 그리드, PG 53
흰색, 검은색, 회색 0-9, 녹색 1-6에 대한 HEX/RGB/CMYK/Spot. 90% 중립, 10% 녹색
사양을 포함한 전체 색상 견본 그리드, PG 54
테마 팔레트: DevX (녹색+분홍색), Copilot (보라색), Security (파란색+주황색+라임색)
전체 사양을 포함한 큰 색상 그리드, PG 55
세 가지 테마: 흰색, 밝은 회색, 검은색. 중립적인 색상에 텍스트; 아이콘/일러스트레이션에 색상
서로 다른 배경의 세 가지 Copilot 코딩 에이전트 예시, PG 56
모든 텍스트는 WCAG AA 규정 준수. Primary, Secondary, Accent 텍스트는 모든 배경에서 AA 통과
AA 규정 준수를 포함한 세 개의 접근성 패널, PG 57
섹션 제목: 마스코트
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 58
세 개의 마스코트: Mona (GitHub), Copilot (AI/혁신), Ducky (개발자)
3D 마스코트 렌더링이 있는 세 개의 열, PG 59
메인 브랜드 홍보대사. 보라색/분홍색 팔레트. 5개의 앵글 뷰
왼쪽 설명, 오른쪽 5개의 3D 렌더링, PG 60
AI 페어 프로그래머. 분홍색이 있는 보라색/파란색. 5개의 앵글 뷰
왼쪽 설명, 오른쪽 5개의 3D 렌더링, PG 61
고무 오리 디버깅 경례. 사용 빈도가 낮음. 5개의 앵글 뷰
왼쪽 설명, 오른쪽 5개의 3D 렌더링, PG 62
해야 할 일: 커뮤니티, 내부, 영감. 하지 말아야 할 일: 로고로 사용, 푸시/판매, 심각한 주제
3열 do/don't 그리드, PG 63
지원 중단: Octocat 1.0, Octocat 2.0, Monamoji, Outline style
금지 아이콘이 있는 4분면 그리드, PG 64
섹션 제목: 아이콘
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 65
Octicons (24px) 기본값. Spot Octicons (60px) gitline 모양의 더 큰 마케팅 아이콘
Octicons 그리드 왼쪽 하단, Spot Octicons 그리드 오른쪽, PG 66
16-30px Octicons, 31-54px 데드존, 55-96px 마케팅 아이콘, 128px+ 일러스트레이션
예제가 있는 4가지 크기 티어, PG 67
gitline 모양(타임라인 + 커밋 원)으로 제작된 60개 이상의 Spot Octicons 세트 완성
전체 아이콘 갤러리 그리드, PG 68
어두운색, 흰색, 밝은 녹색, 밝은 회색 테마 및 플랫 버전을 위한 아이콘 변형
4열 테마 비교, PG 69
아이콘으로 컴포지션 만들기: 주제 기반, 하위 브랜드 색상 추가
왼쪽 설명, 오른쪽 두 개의 블로그 카드 예제, PG 70
섹션 제목: 다이어그램
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 71
정확하고 유익함. 모든 선과 색상 선택이 중요합니다. 막대 차트, 산점도, 파트너 그리드
왼쪽 설명, 오른쪽 3개의 차트 예제, PG 72
비교 주장이 아닌 경우 Spot 아이콘 + 유형. Copilot용 보라색 테마. 녹색 액센트 테두리
주석이 달린 3개의 통계 카드, PG 73
섹션 제목: 타이포그래피
전체 어두운 배경에 큰 흰색 텍스트, PG 74
기본: Mona Sans (Regular + Medium). 보조: 코드/스타일용 Mona Sans Mono
왼쪽 설명, 하단 알파벳 견본, PG 75
OPSZ 축 V2.08+. H0 Display 110/110, Body Large 17/26, Pullquote Mono 58/68
크기/두께 사양이 있는 글꼴 크기 견본, PG 76
H0-H6 계층 구조 (160px ~ 19px). 더 큰 글꼴은 Display Regular, 더 작은 글꼴은 Medium
막대 차트가 있는 전체 제목 계층 구조 H0-H6, PG 77
Body XL ~ Footnote. Blockquote Mono 58/68. Caption, Eyebrow, Footnote 스타일
전체 본문 텍스트 견본 그리드, PG 78
페어링: Eyebrow+Headline, Medium+Medium, Eyebrow 정렬, Headline+Body
6가지 유형의 페어링 예시, PG 79
금지 사항: 다른 너비 스타일, 대문자 여러 줄 모노, 합자, 수동 자간 조정
비교가 포함된 4가지 금지된 예시, PG 80
섹션 제목: 레이아웃
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 81
엄격한 그리드 준수. 그리드/여백(빨간색), 비율(1/3, 1/2, 2/3), 강조 테두리
주석이 있는 Copilot 예시의 그리드 오버레이, PG 82
테두리 기본값 2px, 미묘한 2px, 강조 4px 녹색. 구성 당 하나의 강조
그리드 오버레이가 있는 Universe 참석자 카드, PG 83
콘텐츠가 가장자리로 몰리고, 가운데는 크게 비어 있음. 바닥글/머리글이 일관성 있고 기술적인 느낌을 줌
정렬 주석이 달린 두 가지 레이아웃 예시, PG 84
금지 사항: 제목의 색상 혼합, 콘텐츠 밀집
비교가 포함된 두 가지 금지된 예시, PG 85
섹션 제목: Experiential
큰 흰색 텍스트가 있는 전체 어두운 배경, PG 86
6가지 원칙: Brand forward, Material honesty, Interactive, Comfortable, Modular, Visionary
상단 설명 텍스트, 2x3 그리드에 6가지 원칙 카드, PG 87
허용 사항: 나무/금속 재료, 3D 디테일, LED. 금지 사항: 평면 비닐, 일반 가구. Hero moment 필요
왼쪽 허용/금지 목록, 오른쪽 부스 사진 9장, PG 88
모든 부스에는 적어도 하나의 인터랙티브 요소가 필요함: 풍선, 스티커, 게임, 데모
왼쪽 설명, 오른쪽 인터랙티브 부스 사진 6장, PG 89
시각적 분리를 위한 톤이 있는 주변 조명. 색온도가 분위기를 설정
왼쪽 설명, 오른쪽 조명 사진 4장, PG 90
3단계: Lightweight Presence, Mid-Tier Booth, Custom High-Impact
사진 및 설명이 있는 3단계 열, PG 91
연락처: brand.github.com 툴킷, brand-marketing-design@github.com
연락처 정보가 있는 어두운 배경, PG 92
이 슬라이드 및 기본 프레젠테이션 콘텐츠에 대한 일반적인 질문.
이것은 2026년을 위한 GitHub의 시각적 아이덴티티의 모든 측면을 다루는 포괄적인 89페이지 분량의 브랜드 아이덴티티 시스템입니다. 브랜드 시각 전략(브랜드 속성, 로고, 서브 브랜딩, 코브랜딩), 비주얼 및 일러스트레이션(일러스트레이션 시스템, 색상, 마스코트), 그래픽 요소(아이콘, 다이어그램, 타이포그래피, 레이아웃) 및 이벤트 및 체험(부스 디자인, 건설, 대화형 설치, 조명)의 네 가지 주요 섹션으로 구성되어 있습니다.
GitHub는 다섯 가지 브랜드 속성을 정의합니다. 1) Nerdy(코드, 엔지니어링, 기술에 대한 열정), 2) Confident(야심차고, 신뢰할 수 있고, 지능적임), 3) Authentic(자신과 커뮤니티에 충실함), 4) Imaginative(장난기 있고, 변혁적이고, 적응력이 뛰어남), 5) Empathetic(접근하기 쉽고, 상호 연결되어 있고, 실용적임). 각 속성에는 카피, 디자인 및 경험 가이드라인이 포함되어 있습니다.
GitHub는 Mona Sans 서체 패밀리(산세리프 + 모노스페이스), 회색/검정/흰색을 기반으로 하고 녹색 액센트(#0FBF3E)가 있는 중립적인 기본 팔레트, 제품별 보조 팔레트(Copilot의 경우 보라색, Security의 경우 파란색)가 있는 다크 퍼스트 디자인 시스템을 사용합니다. 시각적 시스템은 3D 등각 투영 일러스트레이션, 컨트리뷰션 그래프 모티프, 디더링 텍스처 및 세 개의 3D 마스코트(Mona, Copilot, Duckie)를 특징으로 합니다.
GitHub는 계층화된 마크 계층 구조를 사용합니다. 컨텍스트가 명확한 경우 Invertocat만 사용하고, 독립 실행형 마케팅의 경우 서브 브랜드 로고(Invertocat + 제품 이름)를 사용하고, 청중이 GitHub를 모를 수 있는 경우 확장된 로고(Invertocat + GitHub + 제품 이름)를 사용합니다. Copilot은 자체 보라색 테마(#8534F3)를 가지고 있고, Security는 파란색(#3094FF)을 가지고 있습니다. 의사 결정 트리 순서도가 로고 선택을 안내합니다.
광학 크기 조정(OPSZ V2.08+)이 적용된 Mona Sans. 헤드라인은 Display Regular(110px에서 H0) 및 Medium(H3-H6)을 사용합니다. 본문은 Regular(15/25 기본) 및 Medium(17/26 크게)을 사용합니다. 코드, 블록 인용문, 눈썹 및 각주에는 Mona Sans Mono를 사용합니다. 합자는 꺼야 합니다. OPSZ를 위해 수동 추적은 금지됩니다.
세 가지 스타일: 1) 주요 일러스트레이션 - 큰 브랜드 순간을 위한 녹색 큐브, 제품 아이콘 및 마스코트가 있는 자세한 3D 등각 투영 장면. 2) 컨트리뷰션 그래프 - 녹색/회색/분홍색 사각형을 사용하여 GitHub 프로필 그리드를 창의적으로 추상화. 3) 텍스처 - 다양한 색상 조합의 비트맵 디더링 패턴(원, 히트맵, 그라데이션, 웨이브, 타원, 반원).
Mona - 분홍색/보라색 Octocat(고양이와 문어의 부분), 주요 브랜드 홍보대사. Copilot - AI 및 혁신을 나타내는 파란색/보라색 로봇 헬멧. Duckie - 개발자 디버깅 전통에 경의를 표하는 노란색 고무 오리, 드물게 사용됩니다.
6가지 디자인 원칙, 3가지 예산 티어(경량에서 맞춤 제작), 재료 지침(항상 인쇄되지 않은 프리미엄 요소 1개 포함), 조명 방향(톤 앰비언트 + 색온도) 및 모든 부스에 최소 1개의 대화형 설치를 의무화합니다.
Create Your Own Slides
Turn your ideas into professional presentations in seconds with 2slides AI.
전문 디자인을 참조하고, 스타일을 선택하며, 완벽한 텍스트 렌더링으로 슬라이드를 생성하세요. Nano Banana로 구동—지금 프레젠테이션 만들기를 시작하세요.
Your AI Agent for slides. Save time, shine faster with intelligent presentation creation.
© 2026 2slides. All rights reserved.