Bardly Design Guidelines

If you're viewing this page, that means you're probably interested in featuring bardly.io on your site or blog. We've put together these guidelines to help you deliver a consistent experience to the bardly app.

Using our logo

If you'd like to feature bardly in a way that's consistent with our site's look and feel, please take from the assets hosted here.

Scalable Vector Graphics (SVG)

Dark logo with text.
White logo with text.

Using our icon

If you don't have the real estate to show the full logo, you can use our icon.

Scalable Vector Graphics (SVG)

Dark icon.
White icon.

Portable Network Graphics (PNG)

Dark icon at 512 by 512 pixels. 512 x 512
Dark icon at 192 by 192 pixels. 192 x 192
Dark icon at 128 by 128 pixels. 128 x 128
Dark icon at 32 by 32 pixels. 32 x 32
Dark icon at 16 by 16 pixels. 16 x 16
White icon at 512 by 512 pixels. 512 x 512
White icon at 192 by 192 pixels. 192 x 192
White icon at 128 by 128 pixels. 128 x 128
White icon at 32 by 32 pixels. 32 x 32
White icon at 16 by 16 pixels. 16 x 16

For a white background, you can use the black outline with purple center icon. On dark backgrounds, you can use the white icon. We'd kindly ask that you do not modify the appearance of the logo, and be sure to keep a legible size.

Colors

We're quite fond of our luxurious purple gradient, so use the color guide below for reference.

#6D6BA2
left side
#8870A2
right side
White bardly logo with text.
linear-gradient(90deg, #6D6BA2, #8870A2)

Fonts

See below for the fonts we use in bardly.

Headers

Roboto Slab

The Quick Brown Fox Jumped Over the Lazy Dog

Content

Roboto

The quick brown fox jumped over the lazy dog. The lazy dog refrained from comment. Some witnesses argue that the fox was in fact orange, as you would expect a fox to be.

Thank you!

We really appreciate your interest in bardly! If you need any clarification or have any other questions, please feel free to reach out to contact@bardly.io.