We are specialists in building digital products that require blockchain implementation.

New York
02:44
Tokyo
15:44
Zagreb
08:44

Toolkit

Let’s build the Shard Labs brand together

These guidelines will help us define and build a consistent brand presence and experience across the world.

Use the assets below for your press-related needs. If you have any questions reach out via our contact form.

Brand Core

The following is a series of statements that shape the foundation for the Shard Labs Brand. It should be the single point of origin for brand building.

Mission we exist

To be the onramp for millions of people to join the Web3 revolution by providing incredible technology that is:

  • Easy to use
  • Easy to understand
  • Incredibly consumer-friendly

Vision we envision

A world where people have control over their data, money, and power of governance.

Values

  • Blockchain technology improvement
  • Constant growth
  • Transparency
  • Freedom

Brand attributes everything we do should feel:

Open

We are inclusive, human, and fun. As our tech reaches the stars, we remain down-to-earth. Think: Human, Inclusive, Friendly, Warm, Approachable, Community-Driven

Intuitive

Everything in Blockchain is complex. We’re here to make it feel easy. We simplify. We clarify. Think: Clear, Simple, Usable, Easy

Comprehensive

We cover our bases. We’re building the foundation for a new world. We don’t skimp on the amenities. Think: Well-documented, Well-supported, Functional, Scalable, Fast

Empathetic

We seek to understand each other, feel the pain, and see things from new perspectives. Think: Human, Understanding, Caring

Secure

We believe that dealing with people’s money and data is serious business. We prioritize security. Think: Trustworthy, Technically Superior

Brand Voice

Confident, not arrogant

Enthusiastic, not silly

Professional, not dry

Optimistic, not bullish

Logos

Correct usage of the Shard Labs logo is essential for consistent brand communication. Please check twice to ensure you’re using the correct logo.

Download all logos

Horizontal

Use in all horizontal contexts.

Stacked

Use this in more vertical contexts

Icon

For token, social or accent.

Horizontal

Use in all horizontal contexts.

Stacked

Use this in more vertical contexts

Icon

For token, social or accent.

Typography

As an integral part of our brand, the following font family should be used. These typefaces are our unique handwriting and add emphasis to the personality of our identity. Like our code, our brand typefaces are also Open Source for maximum accessibility.

Download fonts

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234568790,.;'[]-=+{}[email protected]#$%^&*()

  • Only Semibold, Medium, and Regular weights should be used.
  • Use lots of whitespace (let it breathe!)
  • Text should always be left-aligned

Base Colors

The primary Shard Labs palette is simple and neutral. Blacks, whites, and warm grays. These colors represent the Shard Labs Infrastructure.

Black

Hex: #000000
RGB: 0, 0, 0

Rich Black

Hex: #091012
RGB: 9, 16, 18

Dark Silver

Hex: #707070
RGB: 112, 112, 112

Quick Silver

Hex: #A3A3A3
RGB: 163, 163, 163

White

Hex: #F8F8F8
RGB: 248, 248, 248

Accent Colors

Accent colors should be used sparingly. These accent colors represent the beauty that is created on top of the Shard Labs Infrastructure.

Vermilion

Hex: #E33E10
RGB: 227, 62, 16

Dark Spring Green

Hex: #256955
RGB: 37, 105, 85

Pine Green

Hex: #0F4444
RGB: 15, 68, 68

Arctic Grey

Hex: #96919D
RGB: 150, 145, 157

Gradients

Gradients are an essential part of creating the Shard Labs atmosphere. They should be used subtly and consistently.

Step 1: Create an Ellipse

Create a narrow ellipse and rotate it. Choose two, and only two, colors from the accent palette above. When in doubt, refer to the recommended combinations below.

Step 2: Blur it

Depending on the size of the ellipse and the software you’re using, set the blur anywhere between 100-200 pixels.

Step 3: Set opacity to 25%

Set the opacity of your ellipse to 25%. In some cases, gradients can be used at 50% opacity. But the goal is to be subtle.

Using the Gradient

The gradients can be used in the midst of a layout

Container Frame

Use the gradient to subtly define the edges of a content area.

Edge Light

Use the gradient to subtly define the edges of a content area.

Single Corner

Use the gradient to subtly define the edges of a content area.