Brand
Our logo, colours and badges, for writing about Babblebird or telling people your project can be translated here.
App icon
The full icon is for 64 pixels and up. Smaller than that, use the small one: its beak is the same colour as the bird and its eye is bigger, so it still reads as a bird in a browser tab.
Wordmark
The bird sits on the i. The letters are outlines, so it looks the same everywhere without the font.
Bird
For when the name is already nearby. Its eye is cut out, so whatever is behind it shows through.
Colours
Click a value to copy it. Where there are two, the second is for dark backgrounds.
Coral
The icon’s tile and the bird
Cream
The bird on the icon
Peach
The beak on the icon and on dark backgrounds
Deep coral
The beak on light backgrounds
Ink
Text and the wordmark
Paper
Backgrounds
Using them
Use them freely to write about Babblebird or link to it, just not in a way that suggests we made or vouch for your project.
Give it room: clear space on every side of at least half its height.
Don’t stretch, squash or rotate it, or redraw the bird.
Don’t recolour it. The tile stays coral and the bird stays light.
Don’t add shadows, outlines or glows.
Badges for your README
Let readers know your project is translated here, or ask them to help. For how far each language has come, use your project’s progress badge.
Badge
Colours
Format
<a href="https://babblebird.dev">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://babblebird.dev/api/badge/translated.svg?theme=dark">
<img src="https://babblebird.dev/api/badge/translated.svg" alt="Translated on Babblebird">
</picture>
</a> Mascot
The round bird from our home page, for posts, slides and stickers.
