BRAND GUIDELINE

Transcript

1. © j i n j e r C o . , L t d . F R O M 2 0 2 5 - 2 0 2 6 BRAND GUIDELINE I ’ v e a l w a y s p r a y e d j i n j e r w o u l d b r i n g y o u h a p p i n e s s .
2. CONTENTS 01 LOGO 07 TYPOGRAPHY 10 COLOR 12 ILLUSTRATION
3. CORPORATE LOGO 社名を表記する場合に使用します。 SERVICE LOGO サービス名を表記する場合に使用します。 LOGO TYPE 2タイプのロゴがあります。使用用途に応じて使い分けてください。 1 Brand Guileline © jinjer Co., Ltd.
4. COLOR PRIMARY ジンジャーブランドの軸を作る色です。 デザイン制作の際には、基本的にプライマリーカラーを中心に組み立てます。 YELLOW RGB: 255 230 7 HEX: FFE607 CMYK: 0 5 100 0 BLUE RGB: 16 105 193 HEX: 1069C1 CMYK: 90 50 0 0 NAVY RGB: 10 64 118 HEX: 0A4076 CMYK: 100 85 40 0 10 Brand Guileline © jinjer Co., Ltd.
5. COLOR SECONDARY プライマリーカラーをより際立たせるためのカラーです。 その他イラスト等で使うカラーはtokenに登録されています。 WHITE RGB: 255 255 255 HEX: FFFFFF CMYK: 0 0 0 0 BLACK RGB: 0 0 0 HEX: 000000 CMYK: 0 0 0 100 11 Brand Guileline © jinjer Co., Ltd.
6. TYPE 和文フォントには「Noto sans JP」「Hiragino Kaku Gothic Pro」を使用します。 欧文フォントには「Helvetica Neue」を使用します。 TYPOGRAPHY Noto sans JP Bold むかしむかし、あるところにおじいさんとおばあさん がおりました。ある日おじいさんは山へ柴刈りに、お ばあさんは川へ洗濯に出かけました。ある日、おばあ さんが、川のそばで、せっせと洗濯せんたくをしてい ますと、川上かわかみから、大きな桃ももが一つ、「 Medium むかしむかし、あるところにおじいさんとおばあさん がおりました。ある日おじいさんは山へ柴刈りに、お ばあさんは川へ洗濯に出かけました。ある日、おばあ さんが、川のそばで、せっせと洗濯せんたくをしてい ますと、川上かわかみから、大きな桃ももが一つ、「 Regular むかしむかし、あるところにおじいさんとおばあさん がおりました。ある日おじいさんは山へ柴刈りに、お ばあさんは川へ洗濯に出かけました。ある日、おばあ さんが、川のそばで、せっせと洗濯せんたくをしてい ますと、川上かわかみから、大きな桃ももが一つ、「 7 Brand Guileline © j inj er C o . , L t d.
7. TYPE 和文フォントには「Noto sans JP」「Hiragino Kaku Gothic Pro」を使用します。 欧文フォントには「Helvetica Neue」を使用します。 TYPOGRAPHY W6 むかしむかし、あるところにおじいさんとおばあさん がおりました。ある日おじいさんは山へ柴刈りに、お ばあさんは川へ洗濯に出かけました。ある日、おばあ さんが、川のそばで、せっせと洗濯せんたくをしてい ますと、川上かわかみから、大きな桃ももが一つ、「 W3 むかしむかし、あるところにおじいさんとおばあさん がおりました。ある日おじいさんは山へ柴刈りに、お ばあさんは川へ洗濯に出かけました。ある日、おばあ さんが、川のそばで、せっせと洗濯せんたくをしてい ますと、川上かわかみから、大きな桃ももが一つ、「 Hiragino Kaku Gothic ProN 8 Brand Guileline © jinjer Co., Ltd.
8. TYPE 和文フォントには「Noto sans JP」「Hiragino Kaku Gothic Pro」を使用します。 欧文フォントには「Helvetica Neue」を使用します。 TYPOGRAPHY Helvetica Neue Bold Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Medium Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Regular Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 9 Brand Guileline © jinjer Co., Ltd.
9. TYPE 人物などのイラストがあります。詳細はillustration Guidelineをご確認ください。 ILLUSTRATION 12 Brand Guileline © jinjer Co., Ltd.
10. NORMAL Yellow/5 (#FFE607) + Black/0 (#000000) WHITE White/0 (#FFFFFF) BLACK Black/0 (#000000) YELLOW + WHITE Yellow/5 (#FFE607) + White/0 (#FFFFFF) WHITE + BLACK White/0 (#FFFFFF) + Black/0 (#000000) COLOR 5つのカラーパターンがあります。基本的には「NORMAL」を使用しますが、視認性に欠ける場合はその他のカラーパターンを検討することができます。 LOGO 2 Brand Guileline © jinjer Co., Ltd.
11. COLOR イラストではジンジャーで規定されているカラーを使用します。詳しくはTokensをご確認ください。 ILLUSTRATION 13 Brand Guileline © jinjer Co., Ltd. Primitive Tokens Black 1.00 21.00 AAA black/0 #000000 rgb(0, 0, 0) White 21.00 AAA 1.00 white/0 #FFFFFF rgb(255, 255, 255) Gray 19.43 AAA 1.08 gray/0 #F6F6F6 rgb(246, 246, 246) 16.83 AAA 1.25 gray/1 #E6E6E6 rgb(230, 230, 230) 13.08 AAA 1.61 gray/2 #CCCCCC rgb(204, 204, 204) 10.02 AAA 2.10 gray/3 #B3B3B3 rgb(179, 179, 179) 7.37 AAA 2.85 gray/4 #999999 rgb(153, 153, 153) 5.32 AA 3.95 AA+ gray/5 #808080 rgb(128, 128, 128) 3.66 AA+ 5.74 AA gray/6 #666666 rgb(102, 102, 102) 2.48 8.45 AAA gray/7 #4D4D4D rgb(77, 77, 77) 1.66 12.63 AAA gray/8 #333333 rgb(51, 51, 51) 1.21 17.40 AAA gray/9 #1A1A1A rgb(26, 26, 26) Blue 19.63 AAA 1.06 blue/0 #F2F8FE rgb(242, 248, 254) 16.75 AAA 1.25 blue/1 #D4E8FC rgb(212, 232, 252) 11.83 AAA 1.78 blue/2 #97C7F7 rgb(151, 199, 247) 7.71 AAA 2.72 blue/3 #50A1F1 rgb(80, 161, 241) 5.50 AA 3.82 AA+ blue/4 #1883EC rgb(24, 131, 236) 3.81 AA+ 5.51 AA blue/5 #1069C1 rgb(16, 105, 193) 2.58 8.15 AAA blue/6 #0C5092 rgb(12, 80, 146) 2.58 8.15 AAA blue/7 #0A4076 rgb(10, 64, 118) 1.72 13.16AAA blue/8 #07315A rgb(7, 49, 90) 1.22 17.20 AAA blue/9 #041C34 rgb(4, 28, 52) Green 19.44 AAA 1.08 green/0 #F0F9EA rgb(240, 249, 234) 18.47 AAA 1.14 green/1 #E6F5DD rgb(230, 245, 221) 15.81 AAA 1.33 green/2 #C9E9B6 rgb(201, 233, 182) 13.59 AAA 1.54 green/3 #ACDE8E rgb(172, 222, 142) 11.58 AAA 1.81 green/4 #8FD267 rgb(143, 210, 103) 9.87 AAA 2.13 green/5 #72C640 rgb(114, 198, 64) 6.73 AA 3.12 AA+ green/6 #5BA330 rgb(91, 163, 48) 4.11 AA+ 5.11 AA green/7 #457B25 rgb(69, 123, 37) 2.40 8.74 AAA green/8 #2F5419 rgb(47, 84, 25) 1.42 14.76 AAA green/9 #192D0D rgb(25, 45, 13) Yellow 16.82 AAA 1.03 yellow/0 #FFFCE4 rgb(253, 252, 228) 16.56 AAA 1.05 yellow/1 #FFFBD3 rgb(255, 251, 211) 15.59 AAA 1.11 yellow/2 #FFF5A0 rgb(255, 245, 160) 14.86 AAA 1.17 yellow/3 #FFF06D rgb(255, 240, 109) 14.25 AAA 1.22 yellow/4 #FFEB3A rgb(255, 235, 58) 13.73 AAA 1.26 yellow/5 #FFE607　 rgb(255, 230, 7) 12.53 AAA 1.38 yellow/6 #F5DC00 rgb(245, 220, 0) 10.8 AAA 1.61 yellow/7 #E4CD00 rgb(228, 205, 0) 5.37 AA 3.23 yellow/8 A09000 rgb(160, 144, 0) 2.81 6.18 AA yellow/9 6D6200 rgb(109, 98, 0) Orange 18.82 AAA 1.12 orange/0 #FDF1DF rgb(253, 241, 223) 17.81 AAA 1.18 orange/1 #FCEACF rgb(252, 234, 207) 15.08 AAA 1.39 orange/2 #FAD59E rgb(250, 213, 158) 12.72 AAA 1.65 orange/3 #F7C06E rgb(247, 192, 110) 10.78 AAA 1.95 orange/4 #F5AB3D rgb(245, 171, 61) 9.14 AAA 2.30 orange/5 #F2960D rgb(242, 150, 13) 5.98 AA 3.51 AA+ orange/6 #C2780A rgb(194, 120, 10) 3.67 AA+ 5.72 AA orange/7 #915A08 rgb(145, 90, 8) 2.16 9.74 AAA orange/8 #613C05 rgb(97, 60, 5) 1.31 16.00 AAA orange/9 #301E03 rgb(48, 30, 3) Red 17.67 AAA 1.19 red/0 #FFE6E2 rgb(255, 230, 226) 16.00 AAA 1.31 red/1 #FFD8D1 rgb(255, 216, 209) 11.65 AAA 1.80 red/2 #FFAC9E rgb(255, 172, 158) 8.60 AAA 2.44 red/3 #FF816B rgb(255, 129, 107) 6.61 AA 3.18 AA+ red/4 #FF5538 rgb(255, 85, 56) 5.57 AA 3.77 AA+ red/5 #FF2905 rgb(255, 41, 5) 3.90 AA+ 5.39 AA red/6 #D11E00 rgb(209, 30, 0) 2.58 8.15 AAA red/7 #9E1700 rgb(158, 23, 0) 1.70 12.36 AAA red/8 #6B1000 rgb(107, 16, 0) 1.20 17.46 AAA red/9 #380800 rgb(56, 8, 0) Pink 18.26 AAA 1.15 pink/0 #FDEAF5 rgb(253, 234, 245) 14.68 AAA 1.43 pink/1 #FBCAE5 rgb(251, 202, 229) 10.50 AAA 2.00 pink/2 #F89ACE rgb(248, 154, 206) 7.63 AAA 2.75 pink/3 #F46BB7 rgb(244, 107, 183) 5.88 AA 3.57 AA+ pink/4 #F13BA1 rgb(241, 59, 161) 4.87 AA 4.31 AA+ pink/5 #E81189 rgb(232, 17, 137) 3.32 AA+ 6.32 AA pink/6 #B80E6D rgb(184, 14, 109) 2.23 9.43 AAA pink/7 #890A51 rgb(137, 10, 81) 1.51 13.94 AAA pink/8 #590735 rgb(89, 7, 53) 1.13 18.66 AAA pink/9 #2A0319 rgb(42, 3, 25) Purple 16.51 AAA 1.27 purple/0 #E9E0FA rgb(233, 224, 250) 14.61 AAA 1.44 purple/1 #DFD1F8 rgb(223, 209, 248) 9.83 AAA 2.14 purple/2 #C0A4F2 rgb(192, 164, 242) 6.40 AA 3.28 AA+ purple/3 #A178EB rgb(161, 120, 235) 3.13 AA+ 6.71 AA purple/4 #6E2EE0 rgb(110, 46, 224) 2.54 8.26 AAA purple/5 #5D1ECE rgb(93, 30, 206) 2.12 9.93 AAA purple/6 #501AB0 rgb(80, 26, 176) 1.62 12.96 AAA purple/7 #3C1483 rgb(60, 20, 131) 1.29 16.34 AAA purple/8 #280D57 rgb(40, 13, 87) 1.09 19.29 AAA purple/9 #13062B rgb(19, 6, 43) Semantics Tokens Neutral 19.43 AAA 1.08 neutral/0 #F6F6F6 rgb(246, 246, 246) 16.83 AAA 1.25 neutral/1 #E6E6E6 rgb(230, 230, 230) 13.08 AAA 1.61 neutral/2 #CCCCCC rgb(204, 204, 204) 10.02 AAA 2.10 neutral/3 #B3B3B3 rgb(179, 179, 179) 7.37 AAA 2.85 neutral/4 #999999 rgb(153, 153, 153) 5.32 AA 3.95 AA+ neutral/5 #808080 rgb(128, 128, 128) 3.66 AA+ 5.74 AA neutral/6 #666666 rgb(102, 102, 102) 2.48 8.45 AAA neutral/7 #4D4D4D rgb(77, 77, 77) 1.66 12.63 AAA neutral/8 #333333 rgb(51, 51, 51) 1.21 17.40 AAA neutral/9 #1A1A1A rgb(26, 26, 26) Primary 19.63 AAA 1.06 primary/0 #F2F8FE rgb(242, 248, 254) 16.75 AAA 1.25 primary/1 #D4E8FC rgb(212, 232, 252) 11.83 AAA 1.78 primary/2 #97C7F7 rgb(151, 199, 247) 7.71 AAA 2.72 primary/3 #50A1F1 rgb(80, 161, 241) 5.50 AA 3.82 AA+ primary/4 #1883EC rgb(24, 131, 236) 3.81 AA+ 5.51 AA primary/5 #1069C1 rgb(16, 105, 193) 2.58 8.15 AAA primary/6 #0C5092 rgb(12, 80, 146) 2.58 8.15 AAA primary/7 #0A4076 rgb(10, 64, 118) 1.72 13.16AAA primary/8 #07315A rgb(7, 49, 90) 1.22 17.20 AAA primary/9 #041C34 rgb(4, 28, 52) Secondary 19.43 AAA 1.08 secondary/0 #F6F6F6 rgb(246, 246, 246) 16.83 AAA 1.25 secondary/1 #E6E6E6 rgb(230, 230, 230) 13.08 AAA 1.61 secondary/2 #CCCCCC rgb(204, 204, 204) 10.02 AAA 2.10 secondary/3 #B3B3B3 rgb(179, 179, 179) 7.37 AAA 2.85 secondary/4 #999999 rgb(153, 153, 153) 5.32 AA 3.95 AA+ secondary/5 #808080 rgb(128, 128, 128) 3.66 AA+ 5.74 AA secondary/6 #666666 rgb(102, 102, 102) 2.48 8.45 AAA secondary/7 #4D4D4D rgb(77, 77, 77) 1.66 12.63 AAA secondary/8 #333333 rgb(51, 51, 51) 1.21 17.40 AAA secondary/9 #1A1A1A rgb(26, 26, 26) Info 19.63 AAA 1.06 info/0 #F2F8FE rgb(242, 248, 254) 16.75 AAA 1.25 info/1 #D4E8FC rgb(212, 232, 252) 11.83 AAA 1.78 info/2 #97C7F7 rgb(151, 199, 247) 7.71 AAA 2.72 info/3 #50A1F1 rgb(80, 161, 241) 5.50 AA 3.82 AA+ info/4 #1883EC rgb(24, 131, 236) 3.81 AA+ 5.51 AA info/5 #1069C1 rgb(16, 105, 193) 2.58 8.15 AAA info/6 #0C5092 rgb(12, 80, 146) 2.58 8.15 AAA info/7 #0A4076 rgb(10, 64, 118) 1.72 13.16AAA info/8 #07315A rgb(7, 49, 90) 1.22 17.20 AAA info/9 #041C34 rgb(4, 28, 52) Success 19.44 AAA 1.08 success/0 #F0F9EA rgb(240, 249, 234) 18.47 AAA 1.14 success/1 #E6F5DD rgb(230, 245, 221) 15.81 AAA 1.33 success/2 #C9E9B6 rgb(201, 233, 182) 13.59 AAA 1.54 success/3 #ACDE8E rgb(172, 222, 142) 11.58 AAA 1.81 success/4 #8FD267 rgb(143, 210, 103) 9.87 AAA 2.13 success/5 #72C640 rgb(114, 198, 64) 6.73 AA 3.12 AA+ success/6 #5BA330 rgb(91, 163, 48) 4.11 AA+ 5.11 AA success/7 #457B25 rgb(69, 123, 37) 2.40 8.74 AAA success/8 #2F5419 rgb(47, 84, 25) 1.42 14.76 AAA success/9 #192D0D rgb(25, 45, 13) Warning 18.82 AAA 1.12 warning/0 #FDF1DF rgb(253, 241, 223) 17.81 AAA 1.18 warning/1 #FCEACF rgb(252, 234, 207) 15.08 AAA 1.39 warning/2 #FAD59E rgb(250, 213, 158) 12.72 AAA 1.65 warning/3 #F7C06E rgb(247, 192, 110) 10.78 AAA 1.95 warning/4 #F5AB3D rgb(245, 171, 61) 9.14 AAA 2.30 warning/5 #F2960D rgb(242, 150, 13) 5.98 AA 3.51 AA+ warning/6 #C2780A rgb(194, 120, 10) 3.67 AA+ 5.72 AA warning/7 #915A08 rgb(145, 90, 8) 2.16 9.74 AAA warning/8 #613C05 rgb(97, 60, 5) 1.31 16.00 AAA warning/9 #301E03 rgb(48, 30, 3) Error 17.67 AAA 1.19 error/0 #FFE6E2 rgb(255, 230, 226) 16.00 AAA 1.31 error/1 #FFD8D1 rgb(255, 216, 209) 11.65 AAA 1.80 error/2 #FFAC9E rgb(255, 172, 158) 8.60 AAA 2.44 error/3 #FF816B rgb(255, 129, 107) 6.61 AA 3.18 AA+ error/4 #FF5538 rgb(255, 85, 56) 5.57 AA 3.77 AA+ error/5 #FF2905 rgb(255, 41, 5) 3.90 AA+ 5.39 AA error/6 #D11E00 rgb(209, 30, 0) 2.58 8.15 AAA error/7 #9E1700 rgb(158, 23, 0) 1.70 12.36 AAA error/8 #6B1000 rgb(107, 16, 0) 1.20 17.46 AAA error/9 #380800 rgb(56, 8, 0) Component Tokens Divider 19.43 AAA 1.08 divider/low #F6F6F6 rgb(246, 246, 246) 16.83 AAA 1.25 divider/middle #E6E6E6 rgb(230, 230, 230) 13.08 AAA 1.61 divider/high #CCCCCC rgb(204, 204, 204) Text 13.08 AAA 1.61 text/disabled #CCCCCC rgb(204, 204, 204) 10.02 AAA 2.10 text/placeholder #B3B3B3 rgb(179, 179, 179) 2.48 8.45 AAA text/middle #4D4D4D rgb(77, 77, 77) 1.21 17.40 AAA text/high #1A1A1A rgb(26, 26, 26)
12. ISOLATION 識別性と独立性を保つため、アイソレーション（不可侵領域）を設けています。この領域内には他のデザイン要素や文字などは表示してはいけません。 下に示したのは、確保すべき最小限の保護エリアですが、表示にあたっては可能な限り大きな余白スペースを設けるよう配慮してください。 CORPORATE LOGO アイソレーションはロゴの高さに対して上下左右0.5倍のスペースです。 0.5x x 0.5x 0.5x 0.5x 0.5x 0.5x 0.5x 0.5x SERVICE LOGO アイソレーションはロゴの高さに対して上下左右0.5倍のスペースです。 x LOGO 3 Brand Guileline © jinjer Co., Ltd.
13. MIN SIZE 印刷物で使用する場合、Web上で使用する場合、それぞれにおいての最小サイズを定めています。 これ以下のサイズに縮小すると、細部が潰れ、再現性や美しさを欠く恐れがあるため、使用しないでください。 PRINTING 印刷物の場合の最小サイズは、高さ8mmです。 WEB Webの場合の最小サイズは、高さ28pxです。 28px 8mm LOGO 4 Brand Guileline © jinjer Co., Ltd.
14. WARNING ロゴの取り扱いには十分注意してください。下に示したような誤った使用は避けてください。 境界線を使用しないでください。 ぼかしを使用しないでください。 線画で使用しないでください。 規定のカラーを保ってください。 光彩や陰影を使用しないでください。 規定の余白を保ってください。 LOGO 5 Brand Guileline © jinjer Co., Ltd.
15. WARNING ロゴの取り扱いには十分注意してください。下に示したような誤った使用は避けてください。 私たちは です 文章の一部として使用しないでください。 変形（長体、平体、斜体）しないでください。 ロゴの色や明度と類似した背景、視認性が悪 い背景に配置しないでください。 サイズ及び文字間スペースの変更をしないでく ださい。 ロゴの一部だけを使用したり、要素を削除し たりしないでください。 回転しないでください。 LOGO 6 Brand Guileline © jinjer Co., Ltd.
16. WARNING イラストの取り扱いには十分注意してください。下に示したような誤った使用は避けてください。 線画で使用しないでください。 変形しないでください。 イラストの色や明度と類似した背景、視認性 が悪い背景に配置しないでください。 規定のカラーを保ってください。 イラストの要素を変更したり、削除したりし ないでください。 光彩や陰影を使用しないでください。 ILLUSTRATION 14 Brand Guileline © jinjer Co., Ltd.