The Made with Bulma
badge is available in 6 different versions:
Made with Bulma
The official community badge
6 badges available #
Type | Preview | Description | Download |
---|---|---|---|
Default | ![]() |
White boxed | Download image |
Dark | ![]() |
Dark boxed | Download image |
Semi white | ![]() |
Transparent white and turquoise | Download image |
White | ![]() |
Transparent white | Download image |
Semiblack | ![]() |
Transparent black and turquoise | Download image |
Black | ![]() |
Transparent black | Download image |
All 6 | made-with-bulma-badges.zip |
Download all 6 badges |
Usage #
Ideally the image is displayed at 128x24
pixels, and links back to the Bulma website:
<a href="https://bulma.io">
<img src="/path/to/made-with-bulma.png" alt="Made with Bulma" width="128" height="24">
</a>
Since the original image dimensions are 512x96
pixels, you can also display it at 256x48
without losing any quality:
<a href="https://bulma.io">
<img src="/path/to/made-with-bulma.png" alt="Made with Bulma" width="256" height="48">
</a>
Badge snippets #
You can simply embed an image directly on your website by using one of the following snippets.
<a href="https://bulma.io">
<img src="https://versions.bulma.io/0.7.5/images/made-with-bulma.png" alt="Made with Bulma" width="128" height="24">
</a>
<a href="https://bulma.io">
<img src="https://versions.bulma.io/0.7.5/images/made-with-bulma--dark.png" alt="Made with Bulma" width="128" height="24">
</a>
<a href="https://bulma.io">
<img src="https://versions.bulma.io/0.7.5/images/made-with-bulma--semiwhite.png" alt="Made with Bulma" width="128" height="24">
</a>
<a href="https://bulma.io">
<img src="https://versions.bulma.io/0.7.5/images/made-with-bulma--white.png" alt="Made with Bulma" width="128" height="24">
</a>
<a href="https://bulma.io">
<img src="https://versions.bulma.io/0.7.5/images/made-with-bulma--semiblack.png" alt="Made with Bulma" width="128" height="24">
</a>
This page is open source.
Noticed a typo? Or something unclear?
Improve this page on GitHub