Titles, colours, fonts and layout principles
How to choose visual elements that create clarity, trust and a premium personalised experience
Overview
Every personalised block in Liva 7 includes controls for titles, colours, fonts and layout. These settings shape how shoppers perceive your brand and how easily they can understand the content you present. Good design is not about decoration. It is about clarity, hierarchy and emotional impact.
This article explains the core principles behind titles, typography, colour and layout, and how to use them to create a clean, trustworthy and high converting storefront.
Titles create hierarchy and guide attention
Titles are the first thing shoppers see. They tell the shopper what the block is and why it matters. A strong title creates clarity and reduces cognitive load.
Good titles are:
- short
- descriptive
- consistent
- easy to scan
Examples include:
- You May Also Like
- Complete the Look
- Recommended For You
- Frequently Bought Together
Avoid overly long or overly branded titles. Clarity always wins.
Titles guide attention and help shoppers understand the block instantly.
Typography shapes readability and brand personality
Fonts influence how your brand feels. They also determine how easy your content is to read. Liva 7 allows you to adjust font size, weight and colour so your personalised blocks match your theme.
Use typography to create hierarchy:
- larger text for titles
- medium text for product names
- smaller text for supporting details
Use weight to create emphasis:
- bold for titles
- regular for product information
- light for secondary text
Typography should feel consistent with your theme, not separate from it.
Typography creates hierarchy and reinforces your brand personality.
Colour communicates emotion and clarity
Colour is one of the strongest visual signals. It influences how shoppers feel and how they interpret information. Liva 7 allows you to customise colours for titles, text, prices, borders and backgrounds.
Use colour to:
- reinforce your brand palette
- highlight important information
- create contrast for readability
- maintain visual harmony
Avoid:
- low contrast text
- overly bright colours
- inconsistent colour choices
- colours that clash with your theme
Colour should support clarity, not distract from it.
Use colour to reinforce your brand and improve readability.
Layout creates structure and reduces friction
Layout determines how information is arranged. Good layout makes personalised blocks feel clean, balanced and easy to scan. Poor layout creates clutter and reduces engagement.
Use layout to:
- create breathing room
- separate elements clearly
- maintain consistent spacing
- support mobile readability
Spacing is just as important as the content itself. A clean layout increases trust and makes personalised content feel premium.
Good layout reduces friction and makes content easier to understand.
Card design influences perceived quality
Product cards are a core part of personalised blocks. Liva 7 allows you to adjust card width, height, padding, margin, borders, background and hover effects.
Use card design to:
- create a premium feel
- maintain consistency with your theme
- highlight products without overwhelming the shopper
- support clean spacing and alignment
Subtle design choices often perform better than heavy styling.
Card design shapes how premium your personalised blocks feel.
Use contrast to improve clarity
Contrast helps shoppers distinguish between elements. It is essential for readability and accessibility.
Use contrast to:
- separate text from background
- highlight prices
- emphasise titles
- create visual hierarchy
Low contrast reduces clarity and can make blocks feel unpolished.
Strong contrast improves readability and visual clarity.
Keep styling consistent across all personalised blocks
Consistency is one of the most important design principles. When all personalised blocks follow the same styling rules, your storefront feels unified and intentional.
Consistency applies to:
- titles
- colours
- typography
- spacing
- card design
- hover effects
A consistent experience builds trust and strengthens your brand identity.
Consistent styling creates a cohesive, premium storefront.
Design for mobile first
Most shoppers browse on mobile. Your styling choices must support small screens.
Mobile friendly styling includes:
- larger text sizes
- simplified layouts
- reduced spacing
- clear tap targets
- minimal clutter
A mobile first approach ensures your personalised blocks perform well everywhere.
Mobile first styling ensures clarity and usability on all devices.
Creating a premium visual experience
Titles, colours, fonts and layout work together to create a personalised experience that feels polished and trustworthy. When these elements align with your brand, your storefront feels cohesive and intentional. Good styling increases engagement, improves readability and supports higher conversion.
Styling is not optional. It is part of your brand identity.
Good styling creates a premium, trustworthy personalised experience.
