Lismio Brand

Brand Guidelines

Other Guidelines

Colors

Pure black and white are the primary colors for the Lismio brand. Depending on user preference, black and white can be reversed in Lismio products. For formal documents such as emails, business cards, and letters, it is recommended to use black text on a white background. For digital media like presentations and banners, it is recommended to use white text on a black background.

Shades of Grey can be used for general purposes and to create contrast between design elements. It's important to use high contrast to separate elements and low contrast to group them together. This helps to create a clear and easy-to-navigate user experience.

#1c1c1e

#2c2c2e

#3a3a3c

#48484a

#636366

#8e8e93

#aeaeb2

#c7c7cc

#d1d1d6

#e5e5ea

#f2f2f7

Colors for light and dark content can be used to make elements stand out and connect with the user. When using these color palettes, it's important to follow these best practices:

Use color sparingly and only if you don't show covers.
Avoid using the same color to mean different things.
Make sure your used colors work well in both light and dark appearances.
Consider how artwork and translucency affect nearby colors.
Avoid relying solely on color to differentiate between objects, indicate interactivity, or communicate essential information.
Avoid using colors that make it hard to perceive content.
Consider how the colors you use might be perceived in other countries and cultures.
Use color sparingly and only when necessary, such as to highlight specific elements or create visual interest.
Avoid using the same color to mean different things, as this can be confusing for the user.
Make sure that the colors you use work well in both light and dark appearances.
Consider how artwork and translucency can affect the appearance of nearby colors.
Don't rely solely on color to differentiate between objects, indicate interactivity, or communicate essential information. Use other visual design elements, such as size and placement, to add meaning and context.
Avoid using colors that make it hard to perceive content, such as low-contrast combinations or overly bright or vibrant shades.
Keep in mind that colors can be perceived differently in different countries and cultures, so consider how your color choices might be received by a diverse audience.

#ff453a

#ff9f0a

#ffd60a

#32d74b

#66d4cf

#40c8e0

#64d2ff

#0a84ff

#5e5ce6

#bf5af2

#ff375f

#ac8e68

#ff3b30

#ff9500

#ffcc00

#32c759

#00c7be

#30b0c7

#32ade6

#007aff

#5856d6

#af52de

#ff375f

#ac8e68

The accent color is used as a call-to-action (CTA) to signal something important to the user. It should be directly tied to the Lismio brand and used sparingly to emphasize key actions or elements. When used effectively, the accent color can help to guide the user and create a more engaging and intuitive experience.

#1DD1FF

#03CCFF

#00A5CF

#007C9C

#005469

Color gradients are used to establish a connection to the brand and/or to create a specific mood. They accompany the design language and embed the message in the respective emotion conveyed by the color scheme. Only the specified color gradients should be used. Color gradients always start from the top left and end at the bottom right. They can be used in bold typed headlines or as background but never both.

Lismio

#22d3ee

#0891b2

Petrol

#005469

#002b36

Light

#f2f2f7

#e5e5ea

Dark

#2c2c2e

#1c1c1e

Slate

#94a3b8

#475569

Gray

#9ca3af

#4b5563

Zinc

#a1a1aa

#52525b

Neutral

#a3a3a3

#525252

Stone

#a8a29e

#57534e

Cocoa

#c77b5a

#945b43

Red

#f87171

#dc2626

Orange

#fb923c

#ea580c

Amber

#fbbf24

#d97706

Yellow

#facc15

#ca8a04

Lime

#a3e635

#65a30d

Green

#4ade80

#16a34a

Emerald

#34d399

#059669

Teal

#2dd4bf

#0d9488

Sky

#38bdf8

#0284c7

Blue

#60a5fa

#2563eb

Indigo

#818cf8

#4f46e5

Violet

#a78bfa

#7c3aed

Purple

#c084fc

#9333ea

Fuchsia

#e879f9

#c026d3

Pink

#f472b6

#db2777

Rose

#fb7185

#e11d48

Card Color gradients are used to establish a connection to the brand and/or to create a specific mood. They accompany the design language and embed the message in the respective emotion conveyed by the color scheme. Only the specified color gradients should be used. Color gradients always start from the top left and end at the bottom right.

Artist Card

#ebebf2

#c7c7cc

Audiobook Card

#3a3a3c

#252528

Collection Card

#fbce59

#b68024

Publisher Card

#c2c2cc

#737380

Selection Card

#00e8c5

#00b59a

Series Card

#005469

#002b36

Stage Card

#690000

#450000