You are browsing:
Design Hot Tips
Landing Page lessons related to the overall page design. When you are further with your design, kick off the Landing Page Design Checklist.
#54 - Design Tips

Consider dark mode

Hot Tip #54 is to consider dark mode.

There is something remarkable about a Landing Page with a strong, dark color scheme.

Dark color scheme reference Dark color scheme reference Dark color scheme reference Dark color scheme reference

If your design feels conventional, why not dabble with a dark color scheme for 30 minutes to see how it feels.

  • Dark Scheme Inspiration – A collection of 25 Landing Pages I’ve curated featuring beautifully crafted dark color schemes.
#56 - Design Tips

Increase the contrast of your button text

Hot Tip #56 is to increase the contrast of your CTA button text.

A common design mistake by beginners is keeping the global link color the same throughout Landing Page elements.

This can lead to low contrast CTA buttons:

Button contrast reference

By integrating a text color that’s highly contrasted against the button background, you can create striking CTA buttons:

Button contrast reference
  • Contrast for Mac – great tool I use to ensure my text color contrast is within accessibility guidelines.
#59 - Design Tips

Try font smoothing

Hot Tip #59 is to consider font smoothing.

Simply put, adding the CSS font-smooth property to a font will trim it down very slightly.

While this effect won’t look great on all of your Landing Page typography, it’s particularly effective on ‘chunky’ fonts.

When applied correctly, it can really help polish your typography.

#60 - Design Tips

Liven with illustrations

Hot Tip #60 is to liven with illustrations.

Illustrated characters, devices, and elements can really bring a Landing Page to life:

Illustration reference

I was going to keep this is a secret but the commercial license for the Hot Tips Ebook fire illustration was $4 on Creative Market. It completely changed the way the product looks and feels within the Landing Page:

Illustration reference

Character illustrations are currently on-trend in SaaS Landing Pages. I’d argue they are becoming generic but definitely still work to brighten a stale page:

Illustration reference

If you have the budget, aim to commission custom illustrations from a designer. If not, these resources are a good place to start:

  • Streamline UX – Vincent and his team have launched an illustration tier to their icon library.
  • Blush Design – Online tool to create, mix, and customize illustrations made by artists around the world.
  • Humaaans – Free library to mix and match illustrations of people. Made for Sketch, Figma, InVision Studio and Adobe XD.
  • unDraw – Royalty-free illustration resource by Katerina Limpitsouni.
  • Illustration Inspiration – A collection of 1500+ Landing Pages I’ve curated featuring a mix of illustrations.

The end.

There are no more Hot Tips to load in this archive.

Next