Illustration

Primary colours
High Blue
#5000FF
High Pink
#F69AE4
Low Blue
#171C2B
White
#FFFFFF
Our core brand colour (High Blue) should be the predominant colour used across both marketing and the on-platform experience to help created maximum recognition of the Mixcloud brand. High Pink is our secondary brand colour and is used hand-in-hand with High Blue in the majority of our visual brand expression (and is used as our secondary UI colour within the platform experience. Low Blue and White are the primary ‘base’ colours that act as the more functional side of our primary colour palette.
Base colours
Base 90
#22293C
Base 70
#61667A
Base 20
#D2D3D7
Base 5
#F4F4F5
Base 80
#2A3145
A core part of the brand’s palette is a small collection of ‘base’ colours that power a lot of the utilitarian elements across the product; Text, headings and structural elements within the UI all make use of these colours.
Secondary colours
Yellow Light
#F3F810
Aqua Medium
#19C3B9
High Blue Tint
#E2E3FF
Violet Tint
#FDE1F7
Yellow Tint
#F9FBB2
Green Tint
#E3FAF0
Green Medium
#0CC281
Orange Medium
#F45827
Pink Medium
#D20442
The secondary colour palette has been created to give us more flexibility and creative freedom in our brand expression while aiming to retain consistency, brand recognition and an order to our visual output.

The UI set of colours has specifically been designed for use within the UI. They have been selected for their functional uses (stated below).
Examples in situ
Duo combos
High Blue and High Pink should be used together in a decorative way that doesn’t require strict accessibility. Large headlines are ok, but anything at a smaller size will not pass accessibility.
High Pink on High Blue (or vice versa) for any text that needs full legibility should not be used for accessibility reasons.
Trio combos
High Blue and High Pink can be used together with an accent of orange, primarily when applying a Gradient Map. The orange should make up 10% of the colour in the imagery, with High Blue taking up at least 50%. High Blue should be the majority.
Orange should never be the primary colour when using Core Colour combinations.
This trio combo can work effectively when used in gradient maps that create an interesting clash of colours. It especially works well with monochrome touches to offset the bold use of colour.
An example of the misuse of the brand colour pink and blue
An imbalance of this trio combo can look too forced or messy. High Blue should ideally be a prominent component in this combo.
Trio combos
Low Blue (as well as other base colours) can be used alongside Blue and Pink to create interesting compositions that have monochrome elements to them.
There should always be an element of High Blue in these compositions - they should never be only monochromatic.
You can use any of the Base colours to apply a monochrome filter over photography that may not be in brand colours / too bright. It should always have elements of Core colours (prioritising High Blue).
If they are monochromatic, High Blue should be prioritised as the highlight colour, there should never only be a presence of Pink.
Trio combos
An good example of the use of brand colours blue, pink and yellow
This trio combo can work effectively when used in gradient maps that create an interesting clash of colours. It especially works well with monochrome touches to offset the bold use of colour.
An example of the misuse of the brand colour pink
Blue should be the primary colour (background) or one of the Base colours.
Mixcloud:
the entire suite of Mixcloud products
Mixcloud Pro:
our creator subscription product membership (also known as ‘Pro for creators’)
Mixcloud Premium:
our subscription product for listeners (also known as ‘Premium for listeners’
Creator Subscriptions:
(previous Select) our fan-to-creator subscription product
Pro members:
a creator who pays for Mixcloud Pro
Premium listeners:
a user who pays for Mixcloud Premium
Mixcloud Live:
our live-streaming product
Boosts:
our creator self-serve advertising product
Posts:
a way for creators to communicate  with their fans
Charts:
lists of popular shows per tag
Categories:
featured shows + charts by genre
Stats:
the creator stats portal
Creator Subscription
stats:
additional stats portal for Pro creators
Dashboard:
a user’s logged-in homepage
Chat:
the chat room on a live stream
A show:
an audio upload
A track:
a short form audio upload (a tune)
A live stream:
a video live stream
A post:
a written post
A tag:
a music genre meta-data tag (shows and live)
A playlist:
a playlist of shows
A repost:
a reposted show
A comment:
a public user message on a show or post
A chat message:
a public user message in chat
A profile:
a user’s personal Mixcloud page
Feed:
algorithmic list of new and recommended shows
Settings:
a user’s settings page
A creator:
a user who uploads, live-streams or posts
A listener:
a user who listens, watches or reads
A subscriber:
a user who subscribes to one or more creators
A follower:
a user who follows a given creator
Upload / uploading:
Publishing a show
Live-stream /
live-streaming:
going live
Post / posting:
publishing a new Post
Tag / tagging:
adding genre meta-data tag to shows / live
Repost /
reposting:
reposting another Creator’s show
Favorite /
favoriting:
favoriting a show
Comment /
commenting:
commenting on a show or a post
Send / sending:
writing a chat message
Follow / following:
following a creator’s channel
Share / sharing:
sharing a piece of Mixcloud content
Embed / embedding:
embedding a Mixcloud show on another website
Subscribe / subscribing:
paying for a Creator Subscription (Select)
Upgrade / upgrading:
moving from free to Mixcloud Pro or Premium
Boost / boosting:
buying self-serve adverts to promote a show
Promote stream:
adding a preview of your stream to your social channels
Language

Where possible, we write in American English.

Avoid using old internal phrases such as ‘Cloudcast.’

Avoid the overuse of capitalization in headings in UX copy (e.g. ‘Live Streaming Now’ or ‘My Activity.’) Only capitalize headings and proper nouns.


Dates and times


When possible, use the month’s full name, e.g. 15 October 2021. If there are space constraints, use 3-letter abbreviations e.g. Oct. Don’t write dates numerically e.g. 07-02-14. 

Use the 12-hour clock followed by AM or PM. Include a space after the last number. Include a time zone only if it’s necessary, such as for an event listing. Use the time zone’s abbreviation following the am or pm e.g. 4:00PM NZT.


Timeframes

Where real estate is limited, you can shorten timeframe labels accordingly. Aim to use the full word where it can be afforded. Correct variants include: 5m ago, 5 mins ago, 5 minutes ago.
Be concise

To facilitate navigation and completion of actions, write UI text in short, scannable segments that focus on a limited number of concepts at a time.

Do: Express information and actions concisely e.g. “Publish a Post to communicate directly with your fans.”

Don’t: List many complex implications when introducing a key action or concept e.g. “Make use of our Posts feature to get closer to your fans and share updates to keep them informed.”


Write simply and directly

Use simple, direct language that makes content easy to understand. Use plain language that our creators and fans use. Avoid jargon or technical terminology. Make sure each sentence has a single focus and keep them short. 

Do: Keep UI text short e.g. “Please enter a title below.”

Don’t: Write instructions that are longer than necessary to communicate an action e.g. “You need to enter a show title before continuing.”


Address users clearly

Address users in either the second person (‘you’ or ‘your’) or the first person (‘I,’ ‘me,’ or ‘my’), depending on which is suitable and clearest.

Do: Speak directly to the user in the second person e.g. “Your engagement highlights.”

Don’t: Refer to the user in both the second person and the first person within the same phrase e.g. “You have 3 recent live shows ready to be published to My Profile.”


Communicate essential details

Communicate only essential details so users can focus on their own tasks. Sometimes the most effective UI contains no text at all.

Do: Communicate the details that are essential to understanding a current state or action e.g. “This show is currently a draft.”

Don’t: Provide details that aren't essential for the user to know, such as how an action or process is performed e.g. “This upload is not public - click the Publish button to publish it or manage scheduling at the bottom of the page.”


Write for all reading levels

Use common words that are clearly and easily understandable across all reading levels.

Do: Aim to use words that users with English not as their first language are more likely to understand e.g. “CONNECT” / “‘Show title’ is waiting to be published.”

Don’t: Use words that some users (those with English not as their first language) may not understand e.g. “ENABLE” /  “Keep the momentum going” / “'Show title' is waiting to be published.”


Write in the present tense

Use the present tense to describe product behavior. Avoid using the future tense to describe the way a product always acts. When you need to write in the past or future tenses, use simple verb forms.

Do: Write in the present tense e.g. “Message sent.”

Don’t: Write in different variations of the present tense, such as the present perfect tense e.g. “Message has been sent.”


Use numerals

Use numerals ( “1, 2, 3,” not “one, two, three”) unless writing copy that mixes uses of numbers, such as "Enter two 3s."

Do: Use numerals e.g. “You have 3 draft shows.”

Don’t: Spell out numbers e.g. “You have three draft shows.”


Skip unnecessary punctuation

To help readers scan text at a glance, avoid using punctuation in places where it isn't necessary. 

Do: Skip periods after solo sentences of body text e.g. “Tell your community that you’re live by broadcasting a live preview of your stream on your social channels.” Use exclamation marks sparingly when they are necessary e.g. “You’ve uploaded your first show!”

Don’t: If there is only a single sentence, don't place periods after body text e.g. “Tell your community that you’re live by broadcasting a live preview of your stream on your social channels.” Use exclamation marks on actions that are frequently experienced. Avoid using multiple exclamation marks e.g. “Dublab published a new post!!”


Begin with the objective

When a phrase describes a goal and the action needed to achieve it, start the sentence with the goal.

Do: Communicate the details that are essential to understanding a current state or action e.g. “To improve the stability of your stream for your viewers, we recommend streaming with the following settings.”

Don’t: Provide details that aren't essential for the user to know, such as how an action or process is performed e.g. “We recommend streaming with the following settings to improve stability.”


Reveal detail as needed

Reveal information progressively and as it's needed. In a user's first interaction, every detail doesn't need to be described. Reveal more detail about features as the user explores them and needs more information.

Do: Reveal information progressively e.g. “Connect to your account to send a preview of your stream to your Facebook followers.”

Don’t:  Describe every detail e.g. “Simply connect to your Facebook account to stream a preview to Facebook when you go live on Mixcloud. Your preview will be muted on Facebook.”


Use consistent words

Use words in a consistent manner across your UI features.

Do: Refer to an action with consistent language throughout your UI e.g. "Your profile - your profile is where fans can browse your shows.”

Don’t: Describe an action using different verbs across your UI e.g. “My channel - your channel is where fans can browse your shows.”


Refer to UI elements and controls by label

Labels identify what a control or element does. They appear either on or near the control itself, such as the text on a button or switch. To refer to a UI control or element, mention it using it's label text. Don't state the type of element or control.

Do: State the UI element's label only e.g. “Click continue.”

Don’t: State both the label and the element on which it appears e.g. “Click the Continue button.”


Static input title header

Where possible, when using forms and inputs, we recommend using an action title above the input.

Do: Use an action as a title e.g. “Show Title” / “What shall we call this?”

Don’t: State both the label and the element on which it appears e.g. “Name your show” / “hello world.”


Static input placeholder

We recommend using a helpful tip inside the input as a placeholder. Try not to prescribe a show name.

Do: Call out what we want our creators to do e.g. “Show Title” / “What shall we call this?”

Don’t: Prescribe a name e.g. “Name your show” / Example “hello world”...


Input forms: Mandatory

Where possible, when using forms and inputs, the default label and input suggests mandatory importance.

Do: Have a static label and input suggest mandatory importance e.g. “Show Title” / “What shall we call this?”Don’tUse asterisks to highlight mandatory fields e.g. “Show Title *” / “Example “hello world”


Inputs forms: Optional

Where possible, when using forms and inputs, we recommend using an ‘Optional’ to signify an optional input field.

Do: Use 'Optional' in brackets in the label title to suggest an optional input field e.g. “Secondary Genre (Optional)” / “What shall we call this?”​​

Don’t: Use mandatory styling for an optional input e.g. “Secondary Genre” / “Example “hello world”
This is the style guide for the Mixcloud Blog, detailing how we write. This can be used for new starters to get used to our style and current employees who want to learn how to apply this style to their writing.

This guide explains how and when to use numbers, quotation marks, punctuations, abbreviations, when to use upper and lower case and more. Everyone will have their own written style and will have the freedom to express themselves freely, but this guide will provide parameters for you to stay within to achieve our desired article style.

The first thing to note is that we write in American English. So when drafting an article in a Google/Word document, make sure you change the writing language to American English.The following is a comprehensive guide of the style rules for the blog:


Article structure

Q&A: Questions should be bolded, and the answer portion should begin and end with quotation marks to denote the subject speaking.

Listicle: Each point of list should be summarized in one sentence that will act as a sub-heading for each paragraph. This sentence should be bolded and the answer portion should begin and end with quotation marks.

Long-read: Text broken up into paragraphs of 150-200 words maximum.


Abbreviations


Spell out the first mention in the article text followed by it's acronym in brackets e.g. Musician’s Union (MU) or Universal Music Group (UMG). If you need to mention more than once, after the first mention, always use the acronym.

When using quantities such as money, weight, height or other, use that unit’s shortened metric in lower case e.g. 10 billion pounds is £10bn or 160 megabytes is 160mb.

When describing quantities of people or units, spell out the measurement e.g. 20 million people.


Ampersand (&)

Avoid using unless part of a name e.g. Marketing & Partnerships.


Apostrophes

Avoid using when making a word or acronym plural e.g. USBs not USB’s, 1980s not 1980’s

Use apostrophes when using possessives e.g. ‘The DJ’s set was a mix of House and Techno.’

Don’t use when using plurals of a word or noun e.g. when referring to more than one DJ, the sentence becomes ‘The DJs playing on the night were John Digweed, Emma Warren and Chris Coco.’


Boldening

Bolden subheadings (questions and/or statements).

If you’re working in a Google doc/Word document, bold the title of the article for clarity.


Brand names

Style brand names in the way they do e.g. easyJet, iPhone, TikTok, BRIT Awards, Create. Define. Release., PRS For Music, Jazz re:freshed, PIRATE


Bullet points

Start each point with a capital letter and use a full stop at the end.


Capital letters

Avoid using over-capitalization in body text and headings. Only capitalize the first word of a heading or nouns e.g. Live streaming not Live Streaming, Greg Wilson’s tips not Greg Wilson’s Tips.

For article titles, capitalize the first letter of each word e.g. What Is Mixcloud?

All genres mentioned should be capitalized e.g. House not house.


Colons

Use instead of a dash to introduce a list.


Commas

Use sparingly in sentences. If you find yourself using too many commas, try to use full stops to break up the text.

Don’t use in headings and avoid using in subheadings unless necessary.

When listing items, don’t use a comma before  ‘and.’

Use commas to break up first use of quotes e.g. “The relationship between my production and my DJing it’s something that I’m grateful for,” he says. “They empower each other and have their own relationship beyond me. I’m just the brain and both sides sit on my shoulders telling each other what to do!”


Dash

Use when separating a sentence from an explanatory but related point e.g. ‘The DJ’s set - ranging from House to Techno - was the highlight of the event.’


Dates

Use the month’s full name e.g. October.

When using an exact date, use the number followed by the month’s full name e.g. 1st October.


Full stops

When using a quote, place full stop inside quotation marks e.g. “I would say my number one tip would be to be motivated daily.”


Hyphens

Use when forming adjectives that need to be merged together e.g. ‘community-led.’


Italics

Use sparingly, only for titles of books, albums, films and other mediums.


Job titles

Capitalize each new word of a specific job title e.g. Senior Creator Marketing Manager.

Use lowercase when writing more general job titles e.g. press officers, journalists.


Hyperlinks

All text linking to another article or page must be opened in a new tab e.g. Mixcloud.


Names

Use upper case when naming people, places (where appropriate), companies, brands and genres.


Numbers

All numbers less than 10 should be spelt out e.g. one not 1.

All numbers greater than 10 should be numbered e.g. 12 not twelve.


Paragraphs

Paragraphs shouldn’t be overly long. Aim for 150-200 words per paragraph maximum.


Quotation marks

Use quotation marks when the subject of an article is being quoted.

Quotation marks end when quote ends. If you have to break up speech into paragraphs, avoid putting a mark at the end of a paragraph.

While the subject is talking, use a single inverted comma if necessary to denote when they’re quoting something/someone else e.g. “On a Monday morning, I carve out half an hour to say, ‘OK what do we have this week? What needs to happen? What are the things I need to prioritize?’ So just carving out time to actually plan is something I find really useful.”

When highlighting a particular quote for prominence in an article, bolden the quote and place it where appropriate in the article body.


Semi-colon

Only use when replacing connective words like and or but e.g. ‘The DJ played a classic House set; he saved the last 10 minutes for a medley of Marshall Jefferson tracks.’


Sentence spacing

Use single spaces between words.


Timeframes

Use the full word of a time frame e.g. minutes not min or mins.


Titles

Album, book and film titles should be italicized in article text e.g. Emperor Rosko’s DJ Book.


Underlines

Avoid using.

Body copy

sub header

xxx
Mixcloud
the entire suite of Mixcloud products
Mixcloud Pro
Our creator subscription product membership (also known as ‘Pro for creators’).
Mixcloud Premium
Our subscription product for listeners (also known as ‘Premium for listeners’).
Channel subscriptions (Previously SELECT)
our fan-to-creator subscription product
Pro members
A creator who pays for Mixcloud Pro
Premium listeners
a user who pays for Mixcloud Premium
Mixcloud Live
our live-streaming product
Posts
A way for creators to communicate  with their fans
Charts
lists of popular shows per tag
Categories
featured shows + charts by genre
Stats
creator stats portal
Channel subscription stats
additional stats portal for Pro creators
Dashboard
a user’s logged-in homepage
Chat
the chat room on a live stream
Boosts
our creator self-serve advertising product
Below is some guidance around the usage of our logo suite. If you are looking to download the logo assets, please visit our media kit section
Wordmark
The foundation of our visual brand is the Mixcloud logo. It’s an authentic mark reflecting our connection to Mixcloud listeners, creators and the community.
Icon
Our logo has been designed to dynamically adapt to communications, contracting down to our icon and up to our full wordmark.
Icon examples
The icon represents Mixcloud in areas with limited space or as a visual shorthand across the Mixcloud digital product and our splash screen.  The icon should be used in white when on a Blue Background.
Wordmark colour usage
A) Pink on High Blue

Wherever possible, this colour combination should be used to present the wordmark...
B) White on High Blue

...but at small sizes, this combo should be used to retain maximum accessibility.
A) Pink on High Blue

When the logo is overlaid on top of imagery, it should be displayed in white.
B) White on High Blue

Generally logos can be added on top of collages using the same effects as the composition.
Logo misuses
Do not split, re-stack or reflow the logo.
Do not rotate characters.
Do not split the logo into two colours.Mixcloud should always be shown as one word in one colour.
Do not use different colour combinations for primary Mixcloud applications. Ensure the primary palette is always used.
Textures
A bank of spray paint textures that has been created to be used as a background for any asset. These can be used to underline or highlight text. They can be used in original colours, with brand colour overlays or made large and used with the “saturation” blend mode.

Download here
In use
Scribbles
xx
In use
Interacting with text
“Desaturated” to give a Grey tint
Using scribbles as borders around photography
Using scribbles in colour
Photography
The photography we use as part of our graphic language should always capture the energy of underground music culture through its candid nature and lo-fi over high fidelity, with ‘real’ people at its core.
Textures
A bank of spray paint textures that has been created to be used as a background for any asset. These can be used to underline or highlight text. They can be used in original colours, with brand colour overlays or made large and used with the “saturation” blend mode.

Download here
In use
Scribbles
xx
In use
Interacting with text
“Desaturated” to give a Grey tint
Using scribbles as borders around photography
Using scribbles in colour
Photography
The photography we use as part of our graphic language should always capture the energy of underground music culture through its candid nature and lo-fi over high fidelity, with ‘real’ people at its core.
Value proposition
Mixcloud helps music creators build passionate communities by offering a streaming platform that prioritizes human connections.
Company description
Mixcloud is a music streaming service that enables you to legally live stream and upload mixes, radio shows and original tracks for free. We build tools to help DJs, radio hosts and producers build an online community, reach a wider audience and make money from music.

We've created an environment where every genre, scene and grassroot movement can thrive. Where people who care about music can connect deeply, beyond the algorithm, human to human. We have unique license deals and copyright clearing technology, meaning we pay royalties on the music played and you don’t have to worry about copyright issues.

A Pro subscription provides you with tools to further your career, a Premium subscription offers an uninterrupted, offline listening experience. Mixcloud: People-powered music.
Mixcloud Pro
Tagline
All the tools you need to play and share music with your fans
Value proposition
Live stream, upload and share music. We take care of the copyright.
Description
Mixcloud Pro gives you all the tools you need to play and share music. Become a member to Live-stream. Upload. Share. Learn. Engage. We take care of the copyright. Live-stream music without takedowns. Play music and DJ on the only streaming platform that takes care of music copyright for you. Never worry about copyright and DMCA again. We identify the music you play and pay royalties on your behalf.

That means no takedowns for you and the artists and songwriters you play get paid. Grow your fans, followers and career. Unlock features to message your fans, customize your channel and see advanced stats. Everything you need to grow your career.Join the creator community that genuinely cares about music. Mixcloud is one of the only communities that cares about building a fair and equitable future for music. If you care about music, you're already one of us.
Mixcloud Premium
Tagline
Listen without limits and download for on-the-go listening.
Value proposition
Use this message in places where you want to connect the product to a bigger story about the company.
Support the artists and creators behind the music you love, legally and fairly.
Description
Go Premium to upgrade your playback experience across any channel and on any device.Your subscription helps cover the costs of supporting the music without needing to rely on advertising.
tracks
Tagline
All of your music in the right place
Value proposition
Share your unreleased music with a community of tastemakers and curators who are always on the lookout for new music.
Description
A home for everything you do as a creator

Upload and live stream mixes, radio shows and tracks. No other platform offers creators and curators so many ways to express themselves.


Improve your production skills

Share unlisted tracks to get private feedback early on and see your ideas progress.


Go Pro to unlock unlimited track uploads

Share as many tracks on Mixcloud as you like. Plus, gain access to live streaming, HQ audio, monetization options, engagement stats and much more.
Channel subscriptions
Tagline
Support the creators you love
Value proposition
Subscribe to a creator’s channel to directly support them and the music they play in their shows.
Description
A fan-to-creator membership

Everyday on Mixcloud, over 1 million minutes of audio are uploaded by creators and listened to by fans worldwide for free. Mixcloud Channel Subscriptions let you get more from your favorite creator channels for a small monthly fee.


A model for everyone

Mixcloud Channel Subscriptions are more than just a fan club. It’s a unique revenue share model where everyone involved in making the shows you listen to gets their cut, fairly and legally.


Give more to get more

By subscribing to a creator, they can reward you with an even better listening experience on their channel.
Value proposition
By boosting your shows you can increase your visibility across Mixcloud, reach new audiences and move up the charts.
BOOSTS
Tagline
Increase your visibility and audience
Strapline
PEOPLE
POWERED
MUSIC
How we bring the Mixcloud brand to life through motion is an important aspect of our guidelines. The principles of celebrating people first and foremost, as well as the culture of underground music has inspired how we do this.
Animated elements
We have created a bank of graphic elements that can be used to express an analog, hand-made feel to our marketing touch points, be it across socials, on platform, or wherever moving image is utilised.
Scribbles
Gradient Maps
Typography
Backgrounds
Illustrations
TRANSITIONS
we have a bank of transitions that can be used in between the templated compositions or to transition between full bleed content to give it the collage effect. You can look through these here.
Below is some guidance around the usage of our logo suite. If you are looking to download the logo assets, please visit our media kit section
Mixcloud Pro
Our creator subscription product membership (also known as ‘Pro for creators’).
Colours
High Blue
#5000FF
High Pink
#F69AE4
Low Blue
#171C2B
White
#FFFFFF
Logo variants
Mixcloud Premium
Our subscription product for listeners (also known as ‘Premium for listeners’).
Colours
Low Blue
#171C2B
High Blue
#5000FF
Yellow Light

#F3F810
White
#FFFFFF
Logo variants
Sine Sans
Sine Sans is the primary typeface across all marketing material where we want to express the visual brand to its full potential.

Sine Sans is a bespoke typeface created for Mixcloud with creative ligatures and fluid forms, connecting and amplifying communities and cultures across our brand. Wherever it is used, it should always be set in uppercase. Download Sine Sans here.
Considerations
Use Sine Sans in uppercase only
Use Sine Sans across social and marketing material where possible
Avoid over-use of Sine Sans within platform UI
Avoid over-use of ligatures in any given headline
Ligatures & Alts
Sine Sans contains connective, fluid ligatures and a set of alternative characters.
These have been designed bespokely to represent movement, rhythm and moods. These ligatures and alts can be used to dial up the Mixcloud personality across headlines.
DM Sans
DM Sans is our secondary, accompanying brand font. In marketing material it is used to support Sine Sans. It has been chosen to work hard across digital environments and small sizes. Download DM Sans here.
Considerations
Use DM Sans for body copy
Use DM Sans Regular wherever possible
Use DM Sans Medium when sub headings require added visual hierarchy
Avoid using DM Sans in uppercase
Best practice
'Functional-first'
The use of DM Sans for headlines within the core platform experience is preferable compared to the use of Sine Sans. The over-use of Sine Sans here takes away from our functional-first design approach.
Sparing use of Sine Sans
Marketing touch points such as the example below should make minimal, impactful use of Sine Sans to add some reference to the Mixcloud visual brand.
Controlled use of ligatures
Allow multiple ligatures to dial up the headline.
Middle of the word works best.
Avoid changing the meaning of the word or making it difficult to read through the use of ligatures.
Text effects in marketing material
Sine Sans and DM Sans should be run through the Mixcloud text effect filter when adding it to collage-based assets, so that it blends seamlessly with the image and feels part of it. Download text effect here.
Comfortable line lengths
The optimal line length for body text is 50–75 characters. This count will be smaller for headings.
Avoid using line lengths that are too long (which make it harder to read the content).
DM Sans vs Sine Sans
Use DM Sans when titles are longer than 5 words.
Avoid setting longer titles in Sine Sans.
Sparing use of center-aligned text
If used sparingly and with a comfortable line length, center aligned text works perfectly well within the platform UI.
Product type stack
Font: Sine Sans
Font-size: 88px
Line-height: 1
Attributes: Uppercase / No Alts
Display one
Font: Sine Sans
Font-size: 64px
Line-height: 1
Attributes: Uppercase / No Alts
Display Two
Font: DM Sans Regular
Font-size: 54px
Line-height: 1.1
Attributes: Sentence case no Alts
Display Three
Font: DM Sans Regular
Font-size: 42px
Line-height: 1.1
Attributes: Sentence case no Alts
Headline One
Font: DM Sans Regular
Font-size: 32px
Line-height: 1.1
Attributes: Sentence case no Alts
Headline Two
Font: DM Sans Regular
Font-size: 24px
Line-height: 1.2
Attributes: Sentence case no Alts
Headline Three
Font: DM Sans Regular
Font-size: 18px
Line-height: 1.1
Attributes: Sentence case no Alts
Headline Four
Font: DM Sans Regular
Font-size: 16px
Line-height: 1.4
Attributes: Sentence case no Alts
Body Regular
Font: DM Sans Regular
Font-size: 14px
Line-height: 1.4
Attributes: Sentence case no Alts
Body Small
Font: DM Sans Regular
Font-size: 11px
Line-height: 1.3
Attributes: Sentence case no Alts
Body Extra Small
Font: DM Sans Regular
Font-size: 18px
Line-height: 1
Attributes: Uppercase no Alts
Button Large
Font: DM Sans Regular
Font-size: 14px
Line-height: 1
Attributes: Uppercase no Alts
Button medium
Font: DM Sans Regular
Font-size: 14px
Line-height: 1
Attributes: Sentence case no Alts
Button Small
If you are looking to download our graphic assets, please visit our media kit section
Scribbles
A set of hand-drawn scribbles are available to include in any compositions to add a human touch that gives a sense of personality and looseness to the brand.
In use
Interacting with text
“Desaturated” to give a Grey tint
Using scribbles as borders around photography
Using scribbles in colour
Stickers
We created a library of illustrations that reference underground music culture. They were created based on shapes, iconography and characters that occur in prolific club posters and album artworks. They help bring a sense of personality, humanness and character to our overall branding.  
This library of illustrations can be used with and without background. They can be used to bring personality and life to an asset, as an emoji within a text paragraph, on a saturation filter overlayed on a texture or on platform to represent creator avatars or to bring characters to the platform.

The smiley plays the largest role out of all of the illustrations. There are many variations of the smiley but the standard one is used throughout many assets, to add a human element. It also references music culture like the famous Acid House smiley that has become an iconic symbol of underground dance music culture. Download the stickers here.
In use
These can be used without background similarly to how you would use an emoji to bring meaning or character to a text.
Set to “saturation” overlay to make them semi transparent and grey these can embellish textured backgrounds.
Primarily on UI mock ups, these can be used as avatars or show artworks.
These can be used on platform to add character and colour.
A bank of spray paint textures that has been created to be used as a background for any asset. These can be used to underline or highlight text. They can be used in original colours, with brand colour overlays or made large and used with the “saturation” blend mode.
If you are looking to download some of our graphic assets, please visit our media kit section
Core textures
Secondary textures
B/W textures
In use
The photography we use as part of our graphic language should always capture the energy of underground music culture through its candid nature and lo-fi over high fidelity, with ‘real’ people at its core.
If you are looking to download the any of our photography assets, please visit our media kit section
Photography to avoid
Avoid stock imagery that has a corporate, overly produced feel e.g. smoke and lasers EDM vibes from huge festivals and large festival crowds of people. Crop if needed.
Working with press shots
Apply collage technique to press shots. Using masks to give paper or cut out effect. Can apply gradient map and threshold if permission extended and the colours clash with our brand colours.

Avoid leaving press shots untreated without our graphic language injected into the image somehow e.g. the treated typography