Studies show that deliberate, highly contrasting colors can increase website conversions by up to 400%. Vibrant neon pinks, electric blues, and striking yellows are everywhere and are quickly bringing an end to the era of minimalism.
Examples of Neon in Modern Website Design
Razer’s website has a signature toxic, neon green branding, which is heavily featured against the pitch-black theme. Vercel is another example. They use a dark design with neon accents, including bright colors like cyan. This, combined with high-contrast typography, helps tailor the experience. Modern casino promotions use neon, including pink, yellow, and cyan. Colors like this reflect the lights of Vegas, but also provide contrast.
The latest smartphone design is helping to drive this trend. OLED and AMOLED screens display dark blacks and bright colors very well. Using dark backgrounds over white backgrounds reduces battery consumption by up to 60%.
If neon is used incorrectly, it can backfire. 38% of people will leave a website if the design lacks hierarchy or strains the eyes. 40% of adults across the world have astigmatism to some extent. This can result in fuzziness when neon text is set against a pitch-black background. To combat this, dark greys should be used to ensure structural balance and to provide greater accessibility to audiences.
Neobrutalism is Another Dominating Trend
Neobrutalism is when designers refuse to make something look AI-generated. Brands are leaning into sharp contrasts, which is supported by the neon trend. Heavy borders, geometric shapes, and layouts that feel raw are becoming more common. Designers are leaning into thick outlines and visible grid lines.
Sites that do this well include Diesel’s fashion website. The typography is oversized and has a stark contrast against the white background. Boxes and grid layouts are used to segment fashion items. The design is controlled and goes against the typical look of fashion. Websites like Noramble use bright colors and pop-up animations that operate within the confines of a grid-based design.
Using neobrutalism well involves 2-4px, high-contrast black strokes and 100% opaque drop shadows. These have zero blur and a vibrant color palette. Subtle transitions and soft gradients are avoided. Fonts are an important factor for a successful design. Oversized, bold-display sans-serif headlines work with a readable neutral body.
Mistakes to avoid include forcing big boxes and shapes together without any breathing room. Broken hierarchies, like having too many big headings without purpose, can break the design and make mobile use difficult.
As a general rule, opting for designs that go against the norm and that rebel against sleek and neat designs is prioritized. Neubrutalism and neon colors can be a good match, especially for minimalistic sites that want to break out of last year’s design trends.
Some examples of this being done well can be found on Dribbble. Taking inspiration from art can also be an inventive way for website designers to think outside the box and create distinctive, memorable designs that have a strong impact on audiences. Innovative approaches like this are the basis of neobrutalism.
