What font does 株式会社マイナビ use?

株式会社マイナビ’s website uses two typefaces: 游ゴシック体 (headings and body text), a system font; Noto Sans JP, google Fonts.

What are 株式会社マイナビ’s brand colours?

The main colours on mynavi.jp are Deep Sky Blue (#00AAEB), Chocolate (#EE6600), Royal Blue (#005EAB), Dark Slate Blue (#323746), Dark Green (#006C3B) and Deep Pink (#E63082).

What colour is 株式会社マイナビ’s text and background?

Body text is #323746 on a #FFFFFF background.

Where is 株式会社マイナビ’s logo from?

The logo shown in this guide was found on mynavi.jp’s homepage. For official logo files and usage rules, check 株式会社マイナビ’s own brand or press page.

Is this 株式会社マイナビ’s official style guide?

No. SiteStyleGuide made it from mynavi.jp’s public web pages on 21 October 2026, and isn’t affiliated with 株式会社マイナビ. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from mynavi.jp’s public web pages. Not affiliated with or endorsed by 株式会社マイナビ. The real site is mynavi.jp ↗

Unofficial style guide

株式会社マイナビstyle guide

株式会社マイナビ’s website (mynavi.jp) uses 游ゴシック体 for its headings and body text. Its palette is led by Deep Sky Blue (#00AAEB), Chocolate (#EE6600) and Royal Blue (#005EAB), with #323746 text on #FFFFFF. Captured from the live site on 21 October 2026.

Website: mynavi.jp
Typefaces: 游ゴシック体, Noto Sans JP, Hiragino Kaku Gothic ProN
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 21 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the mynavi.jp homepage on a desktop screen — Screenshot of mynavi.jp on a 1440 px desktop screen, 21 Oct 2026.

Screenshot of the mynavi.jp homepage on a phone — On a phone, 390 px.

Identity & metadata

What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.

Title &
description

Page title: 株式会社マイナビ; ● 8 / 60 characters
Meta description: 一人ひとりの可能性と向き合い、未来が見える世界をつくる。をパーパスに、人々の人生に寄り添い多様な事業を展開する、株式会社マイナビのコーポレートサイト; ● 74 / 160 characters
Site name: 株式会社マイナビ
og:title: 株式会社マイナビ
og:description: 一人ひとりの可能性と向き合い、未来が見える世界をつくる。をパーパスに、人々の人生に寄り添い多様な事業を展開する、株式会社マイナビのコーポレートサイト
Language: ja

In search results

株式会社マイナビhttps://www.mynavi.jp/

株式会社マイナビ

一人ひとりの可能性と向き合い、未来が見える世界をつくる。をパーパスに、人々の人生に寄り添い多様な事業を展開する、株式会社マイナビのコーポレートサイト

When shared

mynavi.jp

株式会社マイナビ

一人ひとりの可能性と向き合い、未来が見える世界をつくる。をパーパスに、人々の人生に寄り添い多様な事業を展開す…

Logo & favicons

Found as: image in the header. PNG, 500 × 124.

Logo

On white

On black

On Deep Sky Blue

Favicons

2 found

48 px · ICO icon
32 px · PNG favicon.ico

株式会社マイナビ

Light browser tab

株式会社マイナビ

Dark browser tab

Colour

Read from the site’s stylesheets and weighted by where each colour is used. Names are the nearest standard colour name. Click a swatch to copy its hex code.

Contrast is against the site’s text colour (#323746) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 24.1%
Black 17.8%
Deep Sky Blue 15%
Off White 9.5%
Chocolate 9%
Royal Blue 7.1%
Dark Grey 5.4%
Dark Slate Blue 2.7%
Dark Green 2.3%
Deep Pink 1.6%
Sea Green 1.3%
Steel Blue 1.2%
Light Sea Green 1%
Orange 0.7%
Dark Slate Grey 0.6%
Dodger Blue 0.6%

By how often each colour appears in the site’s CSS, weighted by where (body, headings, buttons), not by area on the screen.

Neutrals

Text, backgrounds and structure

White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
11.86:1 AAA

On white
—

Background, text, border · .header, .access .tabContentWrap .btnMap a
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
1.77:1 Fail

On white
21.00:1 AAA

Border, text, background · .aboutusLinkArea .btn, .content-sustainability .group .txtBox .inner h2 span::before
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 13

On text
8.73:1 AAA

On white
1.36:1 Fail

Background, border · .listHistory > li, .listProfile > li
Dark Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 57

On text
2.33:1 Fail

On white
5.10:1 AA

Text, background, border · .sponsorship .informationListArea .category.sports, .trendNaviArea .list .txt

Colours

Brand colours and accents, most used first

Deep Sky Blue

HEX

RGB

HSL

OKLCH

CMYK
100 28 0 8

On text
4.49:1 AA large

On white
2.64:1 Fail

Background, text, border · .listHistory > li, .listProfile > li
Chocolate

HEX

RGB

HSL

OKLCH

CMYK
0 57 100 7

On text
3.69:1 AA large

On white
3.21:1 AA large

Background, border, text · .header .gnav li.active > a, .header .subNav a:after
Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 45 0 33

On text
1.80:1 Fail

On white
6.58:1 AA

Background, text · .info .btnContact, .info .btnStudents
Dark Slate Blue

HEX

RGB

HSL

OKLCH

CMYK
29 21 0 73

On text
—

On white
11.86:1 AAA

Text, background · body, .page-template-default .contentsInner .l-column .groupWrap .materiality__table u
Dark Green

HEX

RGB

HSL

OKLCH

CMYK
100 0 45 58

On text
1.81:1 Fail

On white
6.55:1 AA

Background, border, text · .category.research, .playerForm.contract
Deep Pink

HEX

RGB

HSL

OKLCH

CMYK
0 79 43 10

On text
2.89:1 Fail

On white
4.11:1 AA large

Background, text · .category.other, .trendNaviArea .secTit:after
Sea Green

HEX

RGB

HSL

OKLCH

CMYK
46 0 35 49

On text
2.59:1 Fail

On white
4.58:1 AA

Text, background, border · .l-column #ot-sdk-btn.ot-sdk-show-settings, .r_privacy .classification.onetrust
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
100 40 0 27

On text
2.30:1 Fail

On white
5.15:1 AA

Text · .purposeInner .porposeArea h2, .companyAboutArea .titBox>.tit
Light Sea Green

HEX

RGB

HSL

OKLCH

CMYK
100 1 0 30

On text
4.53:1 AA

On white
2.62:1 Fail

Background · .info .btnCorporate
Orange

HEX

RGB

HSL

OKLCH

CMYK
0 28 73 2

On text
6.64:1 AA

On white
1.79:1 Fail

Background · .purpose .philosophyArea .column .txtBox .tit.color-1::before, .r_privacy .classification.social__media
Dark Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
68 23 0 72

On text
1.06:1 Fail

On white
12.55:1 AAA

Background · .header .menuBtn span
Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
100 37 0 9

On text
3.59:1 AA large

On white
3.31:1 AA large

Background · .indexKvArea.eng:after

Gradients

radial-gradient(circle farthest-side, #EE6600, #EE6600 33.333%, transparent 33.333%, transparent)
linear-gradient(to right, #00aaeb 0%, #00aaeb 84px, #ddd 84px , #ddd 100%)
linear-gradient(to right, #00aaeb, #00aaeb 200px, #ddd 200px , #ddd)

Typography

Faces from Google Fonts are shown in the real thing. Others are licensed to the site, so they show in your device’s copy if you have one, or a stand-in if not.

游ゴシック体

Aa 700

游ゴシック体

System font, or not loaded on this page · weights 700 · body · shown in a stand-in if you don’t have it

Aa 400

Noto Sans JP

Google Fonts · weights 400 · body

Aa 400

Hiragino Kaku Gothic ProN

System font, or not loaded on this page · body · shown in a stand-in if you don’t have it

Aa 400

Yu Gothic

System font, or not loaded on this page · body · shown in a stand-in if you don’t have it

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”

Type scale

From the site’s CSS · root 10 px

Body 1.4rem · 14 px 游ゴシック体

一人ひとりの可能性と向き合い、未来が見える世界をつくる。をパーパスに、人々の人生に寄り添い多様な事業を展開する、株式会社マイナビのコーポレ…

Small 80%

Link 1.6rem · 16 px / 1.2 weight 700 · 游ゴシック体

Read more about 株式会社マイナビ

Sizes in use

Most common across the site

36pxline 1.3 · 4 rules
20pxline 1.2 · 7 rules
18pxline 1.333333333 · 20 rules
16pxline 1.5 · 26 rules
15pxline 1.6 · 13 rules
14pxline 1.714285714 · 28 rules
13px4 rules
12pxline 1.666666667 · 12 rules

Elements

The main button and link as the site’s CSS draws them, and the corner radii and shadows it uses most.

Elements

Button

Get started

.indexKvArea .slick-dots button · #8B8B8B · radius 50%

Link

Read our latest news today.

a · #000000

Corner radius

4px · 13×
5px · 9×
50% · 6×
3px · 4×
10px · 2×
50px · 1×

Shadows

0 0 24px rgba(0, 0, 0, .1)
0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.17)
0px 3px 16px rgba(8, 34, 82, 0.24)

Layout

Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.

Grid

Breakpoints

767

768

959

960

1024

1039

1150

1280

On a scale of 0 to 1440 px.

Content widths (max-width)

1154 px

1040 px

915 px

800 px

601 px

327 px

Notes

Plain checks on what was found. Worth fixing if you look after this site.

Notes

● FineThe title is 8 characters, short enough to show in full in search results.

Questions

Quick answers, from the same capture as the rest of this guide.

Questions

What font does 株式会社マイナビ use?: 株式会社マイナビ’s website uses two typefaces: 游ゴシック体 (headings and body text), a system font; Noto Sans JP, google Fonts.
What are 株式会社マイナビ’s brand colours?: The main colours on mynavi.jp are Deep Sky Blue (#00AAEB), Chocolate (#EE6600), Royal Blue (#005EAB), Dark Slate Blue (#323746), Dark Green (#006C3B) and Deep Pink (#E63082).
What colour is 株式会社マイナビ’s text and background?: Body text is #323746 on a #FFFFFF background.
Where is 株式会社マイナビ’s logo from?: The logo shown in this guide was found on mynavi.jp’s homepage. For official logo files and usage rules, check 株式会社マイナビ’s own brand or press page.
Is this 株式会社マイナビ’s official style guide?: No. SiteStyleGuide made it from mynavi.jp’s public web pages on 21 October 2026, and isn’t affiliated with 株式会社マイナビ. Members can refresh a guide after 90 days to pick up changes.

Design tokens

Everything above as CSS variables, ready to paste into a project. Members can download the tokens as files for Figma (Tokens Studio), Style Dictionary and Tailwind.

Tokens

mynavi-jp-tokens.css

Download

Free with an account: sign up or sign in, and you’ll come straight back here.

/* mynavi.jp design tokens, from SiteStyleGuide (https://sitestyleguide.com/mynavi.jp) */
:root {
  /* Colours */
  --text: #323746;
  --background: #FFFFFF;
  --colour-white: #FFFFFF;
  --colour-black: #000000;
  --colour-off-white: #DDDDDD;
  --colour-dark-grey: #6E6E6E;
  --colour-deep-sky-blue: #00AAEB;
  --colour-chocolate: #EE6600;
  --colour-royal-blue: #005EAB;
  --colour-dark-slate-blue: #323746;
  --colour-dark-green: #006C3B;
  --colour-deep-pink: #E63082;
  --colour-sea-green: #468254;
  --colour-steel-blue: #0071BB;
  --colour-light-sea-green: #00B2B3;
  --colour-orange: #FAB543;
  --colour-dark-slate-grey: #173747;
  --colour-dodger-blue: #0093E9;
  --gradient-1: radial-gradient(circle farthest-side, #EE6600, #EE6600 33.333%, transparent 33.333%, transparent);
  --gradient-2: linear-gradient(to right, #00aaeb 0%, #00aaeb 84px, #ddd 84px , #ddd 100%);
  --gradient-3: linear-gradient(to right, #00aaeb, #00aaeb 200px, #ddd 200px , #ddd);

  /* Typefaces */
  --font-body: '游ゴシック体', 'Yu Gothic', 'YuGothic', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ';
  --font-other: 'Roboto', sans-serif;

  /* Type scale */
  --text-body: 1.4rem;
  --text-small: 80%;
  --text-a: 1.6rem;
  --leading-a: 1.2;

  /* Shape */
  --radius-1: 4px;
  --radius-2: 5px;
  --radius-3: 50%;
  --radius-4: 3px;
  --radius-5: 10px;
  --radius-6: 50px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 767px;
  --breakpoint-2: 768px;
  --breakpoint-3: 959px;
  --breakpoint-4: 960px;
  --breakpoint-5: 1024px;
  --breakpoint-6: 1039px;
  --breakpoint-7: 1150px;
  --breakpoint-8: 1280px;
  --max-width-1: 1154px;
  --max-width-2: 1040px;
  --max-width-3: 915px;
  --max-width-4: 800px;
  --max-width-5: 601px;
  --max-width-6: 327px;
}

{
    "site": "mynavi.jp",
    "source": "https://sitestyleguide.com/mynavi.jp",
    "text": "#323746",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Off White",
            "hex": "#DDDDDD",
            "rgb": [
                221,
                221,
                221
            ]
        },
        {
            "name": "Dark Grey",
            "hex": "#6E6E6E",
            "rgb": [
                110,
                110,
                110
            ]
        },
        {
            "name": "Deep Sky Blue",
            "hex": "#00AAEB",
            "rgb": [
                0,
                170,
                235
            ]
        },
        {
            "name": "Chocolate",
            "hex": "#EE6600",
            "rgb": [
                238,
                102,
                0
            ]
        },
        {
            "name": "Royal Blue",
            "hex": "#005EAB",
            "rgb": [
                0,
                94,
                171
            ]
        },
        {
            "name": "Dark Slate Blue",
            "hex": "#323746",
            "rgb": [
                50,
                55,
                70
            ]
        },
        {
            "name": "Dark Green",
            "hex": "#006C3B",
            "rgb": [
                0,
                108,
                59
            ]
        },
        {
            "name": "Deep Pink",
            "hex": "#E63082",
            "rgb": [
                230,
                48,
                130
            ]
        },
        {
            "name": "Sea Green",
            "hex": "#468254",
            "rgb": [
                70,
                130,
                84
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#0071BB",
            "rgb": [
                0,
                113,
                187
            ]
        },
        {
            "name": "Light Sea Green",
            "hex": "#00B2B3",
            "rgb": [
                0,
                178,
                179
            ]
        },
        {
            "name": "Orange",
            "hex": "#FAB543",
            "rgb": [
                250,
                181,
                67
            ]
        },
        {
            "name": "Dark Slate Grey",
            "hex": "#173747",
            "rgb": [
                23,
                55,
                71
            ]
        },
        {
            "name": "Dodger Blue",
            "hex": "#0093E9",
            "rgb": [
                0,
                147,
                233
            ]
        }
    ],
    "fonts": [
        {
            "name": "游ゴシック体",
            "stack": "\"游ゴシック体\", \"Yu Gothic\", YuGothic, \"ヒラギノ角ゴ Pro\", \"Hiragino Kaku Gothic Pro\", \"メイリオ\", Meiryo, \"MS Pゴシック\", \"MS PGothic\", sans-serif",
            "weights": [
                700
            ],
            "source": "System font, or not loaded on this page"
        },
        {
            "name": "Noto Sans JP",
            "stack": "\"Noto Sans JP\"",
            "weights": [
                400
            ],
            "source": "Google Fonts"
        },
        {
            "name": "Hiragino Kaku Gothic ProN",
            "stack": "'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif",
            "weights": [],
            "source": "System font, or not loaded on this page"
        },
        {
            "name": "Yu Gothic",
            "stack": "\"Yu Gothic\", \"游ゴシック\", YuGothic, \"游ゴシック体\", \"ヒラギノ角ゴ Pro W3\", \"メイリオ\", sans-serif",
            "weights": [],
            "source": "System font, or not loaded on this page"
        },
        {
            "name": "Roboto",
            "stack": "'Roboto', sans-serif",
            "weights": [
                300,
                900
            ],
            "source": "System font, or not loaded on this page"
        },
        {
            "name": "Arial",
            "stack": "Arial",
            "weights": [],
            "source": "System font, or not loaded on this page"
        }
    ]
}

Websites whose lead colour is closest to 株式会社マイナビ’s

Calculatio

calculat.io · 4 days ago
Save
آپارات

aparat.com · 1 day ago
Save
Movies Anywhere

moviesanywhere.com · 3 days ago
Save
Weather Underground

wunderground.com · 5 days ago
Save

Captured from mynavi.jp on 21 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by 株式会社マイナビ; this guide describes the public website for reference.

株式会社マイナビstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Off White

Dark Grey

Colours

Deep Sky Blue

Chocolate

Royal Blue

Dark Slate Blue

Dark Green

Deep Pink

Sea Green

Steel Blue

Light Sea Green

Orange

Dark Slate Grey

Dodger Blue

Gradients

游ゴシック体

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run mynavi.jp?

Similar colours

Calculatio

آپارات

Movies Anywhere

Weather Underground

Title &
description