What font does BASS use?

BASS’s website uses one typeface: EaseStandard-Medium (headings and body text), self-hosted.

What are BASS’s brand colours?

The main colours on bassbcn.com are Dim Grey (#4A5464), Deep Sky Blue (#00B2FF), Slate Grey (#728197), Pink (#F2C1C1), White (#FFFFFF) and Black (#000000).

What colour is BASS’s text and background?

Body text is #000000 on a #F3F3F3 background.

Where is BASS’s logo from?

The logo shown in this guide was found on bassbcn.com’s homepage. For official logo files and usage rules, check BASS’s own brand or press page.

Is this BASS’s official style guide?

No. SiteStyleGuide made it from bassbcn.com’s public web pages on 22 October 2026, and isn’t affiliated with BASS. Members can refresh a guide after 90 days to pick up changes.

BASS Style Guide: Colours, Fonts & Logo

Identity & metadata

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

Title &
description

Page title: BASS – Barcelona Arts Summer School; ● 35 / 60 characters
Meta description: Missing; ▲ 0 / 160 characters
Language: en-US

In search results

BASShttps://bassbcn.com/

BASS – Barcelona Arts Summer School

When shared

No og:image, so no picture

bassbcn.com

BASS – Barcelona Arts Summer School

Back to top ↑

Logo & favicons

Found as: SVG in the header. SVG, 1469 × 501.

Logo

On white

On black

On Dim Grey

Favicons

3 found

192 px · JPG icon
180 px · JPG apple-touch-icon
32 px · JPG icon

BASS – Barcelona Arts Summer School

Light browser tab

BASS – Barcelona Arts Summer School

Dark browser tab

Back to top ↑

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 (#000000) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 50.4%
Black 21.9%
Near Black 12.1%
Off White 7.2%
Dim Grey 4.5%
Deep Sky Blue 2.5%
Slate Grey 0.8%
Pink 0.7%

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
21.00:1 AAA

On white
—

Background, text, border · body, .btn span.btn-bg
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
—

On white
21.00:1 AAA

Background, text, graphic · .footer-bg-black:before, .section-1-content:before
Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 90

On text
1.21:1 Fail

On white
17.40:1 AAA

Text, background, border · p::selection, p::-moz-selection
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 11

On text
16.36:1 AAA

On white
1.28:1 Fail

Background · .header-hero-wrapper .hero-content .hero-btn.hero-btn-black:hover, .jcf-scrollbar-vertical

Colours

Brand colours and accents, most used first

Dim Grey

HEX

RGB

HSL

OKLCH

CMYK
26 16 0 61

On text
2.74:1 Fail

On white
7.65:1 AAA

Text, background · .plyr__badge, .plyr__menu__container
Deep Sky Blue

HEX

RGB

HSL

OKLCH

CMYK
100 30 0 0

On text
8.81:1 AAA

On white
2.38:1 Fail

Background, border, text · .plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:bef, .plyr__control--overlaid
Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
25 15 0 41

On text
5.30:1 AA

On white
3.96:1 AA large

Border · .plyr__menu__container .plyr__control--forward:after, .plyr__menu__container .plyr__control--back:after
Pink

HEX

RGB

HSL

OKLCH

CMYK
0 20 20 5

On text
13.17:1 AAA

On white
1.59:1 Fail

Used · --highlight-high, --border-high

Gradients

linear-gradient(#0000,#000000bf)
linear-gradient(180deg,#0000,#000 20%,#000 80%,#0000)
linear-gradient(180deg,#000,#000 70%,#0000)

Back to top ↑

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.

EaseStandard-Medium

Aa 400

EaseStandard-Medium

Self-hosted · weights 400 · body, headings · shown in a stand-in if you don’t have it

Aa 400

Apple Color Emoji

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

Heading 1 24px / 28px EaseStandard-Medium

BASS

Heading 2 24px / 28px EaseStandard-Medium

BASS – Barcelona Arts Summer School

Heading 3 24px / 28px EaseStandard-Medium

BASS – Barcelona Arts Summer School

Heading 4 14px / 16px

BASS – Barcelona Arts Summer School

Heading 5 14px / 16px

BASS – Barcelona Arts Summer School

Heading 6 14px / 16px

BASS – Barcelona Arts Summer School

Body 12px / 16px EaseStandard-Medium

The quick brown fox jumps over the lazy dog.

Paragraph 100%

The quick brown fox jumps over the lazy dog.

Small 100%

The quick brown fox jumps over the lazy dog.

Button 100% none

Get started

Link 100%

Sizes in use

Most common across the site

30pxline 30px · 3 rules
20pxline 1.75rem · 4 rules
18pxline 1.75rem · 4 rules
16pxline normal · 6 rules
14pxline 18px · 13 rules
13pxline 28px · 7 rules
12pxline 16px · 5 rules
10pxline 10px · 3 rules

Back to top ↑

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

.btn span.btn-bg · #FFFFFF · radius 9999px

Corner radius

9999px · 7×
2px · 5×
100% · 5×
2.5px · 5×
calc(2px/2) · 5×
50% · 4×

Shadows

0 1px 2px #00000026
0 1px 1px #23282f26,0 0 0 1px #23282f33
0px
0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a

Back to top ↑

Layout

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

Grid

Breakpoints

480

600

767

768

880

1024

1149

On a scale of 0 to 1440 px.

Content widths (max-width)

1440 px

1400 px

880 px

480 px

Back to top ↑

Notes

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

Notes

● FineThe title is 35 characters, short enough to show in full in search results.
▲ CheckThere is no meta description, so search engines will pick text from the page.
▲ CheckThere is no og:image, so links shared on social media show no picture.

Back to top ↑

Questions

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

Questions

What font does BASS use?: BASS’s website uses one typeface: EaseStandard-Medium (headings and body text), self-hosted.
What are BASS’s brand colours?: The main colours on bassbcn.com are Dim Grey (#4A5464), Deep Sky Blue (#00B2FF), Slate Grey (#728197), Pink (#F2C1C1), White (#FFFFFF) and Black (#000000).
What colour is BASS’s text and background?: Body text is #000000 on a #F3F3F3 background.
Where is BASS’s logo from?: The logo shown in this guide was found on bassbcn.com’s homepage. For official logo files and usage rules, check BASS’s own brand or press page.
Is this BASS’s official style guide?: No. SiteStyleGuide made it from bassbcn.com’s public web pages on 22 October 2026, and isn’t affiliated with BASS. Members can refresh a guide after 90 days to pick up changes.

Back to top ↑

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

bassbcn-com-tokens.css

Download

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

/* bassbcn.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/bassbcn.com) */
:root {
  /* Colours */
  --text: #000000;
  --background: #F3F3F3;
  --colour-white: #FFFFFF;
  --colour-black: #000000;
  --colour-near-black: #1A1A1A;
  --colour-off-white: #E3E3E3;
  --colour-dim-grey: #4A5464;
  --colour-deep-sky-blue: #00B2FF;
  --colour-slate-grey: #728197;
  --colour-pink: #F2C1C1;
  --gradient-1: linear-gradient(#0000,#000000bf);
  --gradient-2: linear-gradient(180deg,#0000,#000 20%,#000 80%,#0000);
  --gradient-3: linear-gradient(180deg,#000,#000 70%,#0000);

  /* Typefaces */
  --font-body: 'EaseStandard-Medium';
  --font-headings: 'EaseStandard-Medium';

  /* Type scale */
  --text-h1: 24px;
  --leading-h1: 28px;
  --text-h2: 24px;
  --leading-h2: 28px;
  --text-h3: 24px;
  --leading-h3: 28px;
  --text-h4: 14px;
  --leading-h4: 16px;
  --text-h5: 14px;
  --leading-h5: 16px;
  --text-h6: 14px;
  --leading-h6: 16px;
  --text-body: 12px;
  --leading-body: 16px;
  --text-p: 100%;
  --text-small: 100%;
  --text-button: 100%;
  --text-a: 100%;

  /* Shape */
  --radius-1: 9999px;
  --radius-2: 2px;
  --radius-3: 100%;
  --radius-4: 2.5px;
  --radius-5: calc(2px/2);
  --radius-6: 50%;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 480px;
  --breakpoint-2: 600px;
  --breakpoint-3: 767px;
  --breakpoint-4: 768px;
  --breakpoint-5: 880px;
  --breakpoint-6: 1024px;
  --breakpoint-7: 1149px;
  --max-width-1: 1440px;
  --max-width-2: 1400px;
  --max-width-3: 880px;
  --max-width-4: 480px;
}

{
    "site": "bassbcn.com",
    "source": "https://sitestyleguide.com/bassbcn.com",
    "text": "#000000",
    "background": "#F3F3F3",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Near Black",
            "hex": "#1A1A1A",
            "rgb": [
                26,
                26,
                26
            ]
        },
        {
            "name": "Off White",
            "hex": "#E3E3E3",
            "rgb": [
                227,
                227,
                227
            ]
        },
        {
            "name": "Dim Grey",
            "hex": "#4A5464",
            "rgb": [
                74,
                84,
                100
            ]
        },
        {
            "name": "Deep Sky Blue",
            "hex": "#00B2FF",
            "rgb": [
                0,
                178,
                255
            ]
        },
        {
            "name": "Slate Grey",
            "hex": "#728197",
            "rgb": [
                114,
                129,
                151
            ]
        },
        {
            "name": "Pink",
            "hex": "#F2C1C1",
            "rgb": [
                242,
                193,
                193
            ]
        }
    ],
    "fonts": [
        {
            "name": "EaseStandard-Medium",
            "stack": "EaseStandard-Medium",
            "weights": [
                400
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Apple Color Emoji",
            "stack": "ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\"",
            "weights": [],
            "source": "System font, or not loaded on this page"
        }
    ]
}

Back to top ↑

Share

Links open each service’s own share page. Nothing from them loads here.

Share

X LinkedIn Facebook Pinterest Reddit Email

Run bassbcn.com?

Add the badge to your site

Link to this guide from your own site, so your team, designers and agencies can find your colours and fonts in one place.

<a href="https://sitestyleguide.com/bassbcn.com" title="BASS style guide on SiteStyleGuide"><img src="https://sitestyleguide.com/public/badge.svg" alt="View our style guide on SiteStyleGuide" width="200" height="44"></a>

Back to top ↑

BASSstyle guide

Title &
description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Near Black

Off White

Colours

Dim Grey

Deep Sky Blue

Slate Grey

Pink

Gradients

EaseStandard-Medium

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

k618.cn

IGN

tai-xiu-online.com

php.net

BASSstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Near Black

Off White

Colours

Dim Grey

Deep Sky Blue

Slate Grey

Pink

Gradients

EaseStandard-Medium

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run bassbcn.com?

Similar colours

k618.cn

IGN

tai-xiu-online.com

php.net

Title &
description