How to balance readability and aesthetics when removing tile overlays

How to balance readability and aesthetics when removing tile overlays

How to balance readability and aesthetics when removing tile overlays

The Home page in Cadence features tiles with a default gray overlay that helps ensure text remains readable against various background images. While removing this overlay can create a more vibrant visual experience, it may affect text legibility. This guide will help you find the right balance between aesthetics and readability when customizing your Home page tiles.

When to use

  • When you want to showcase vibrant tile images without the gray tint
  • When your brand guidelines require unaltered image display
  • When you have carefully selected high-contrast images for your tiles
  • When you need to maintain text readability while removing overlays

How to do it

    Log in to your Cadence Admin account.
    Navigate to your event dashboard.
    Click on "Home" in the left sidebar menu.
    Select the "Settings" tab at the top of the page.
    Locate the "Remove Home Tile Overlay" checkbox in the settings panel.
Removing the overlay may affect text readability if your tile images have low contrast or busy patterns.
    Check the box to remove the gray overlay from all Home tiles.
    Enable the "Gradient Slider Adjust Home Screen Opacity" option to gain more control over background opacity.
This gives you a middle ground between completely removing the overlay and keeping the default setting.
    Adjust the opacity slider to find the optimal balance (15-30% is often effective).
Lower opacity percentages show more of your original image but may reduce text readability.
    Preview your changes by clicking the "Preview" button in the upper right corner.
    Test readability by checking if text on all tiles remains clearly visible.
    Make adjustments to individual tile images if needed:
  • Use images with solid or less busy areas where text appears
  • Choose images with natural contrast that supports text visibility
  • Consider darker images for better text contrast
    Click "Save" at the bottom of the page to apply your changes.

Troubleshooting

If text becomes difficult to read after removing the overlay, try increasing the opacity percentage, using the "Centered" alignment option to place text in more consistent positions, or replacing problematic images with ones that have better contrast in text areas.

Related links

  • How to customize the Home page appearance
  • How to adjust the Home screen opacity using the gradient slider
  • How to optimize Home tile content for different layouts