Liquid Glass and Current Design Trends: What Business Websites Should Borrow

If you have used a new iPhone recently, you have seen it: toolbars and buttons that look like translucent glass, picking up colours from whatever sits behind them. Apple calls this Liquid Glass. Designers and clients now ask whether their websites should look the same. The honest answer is: borrow the thinking, not the transparency.

What Apple announced

Apple previewed Liquid Glass on 9 June 2025. Its press release describes a translucent material that reflects and refracts its surroundings, takes colour from nearby content and adapts to light and dark settings. It applies to controls, navigation, icons and widgets across iOS 26, iPadOS 26, macOS Tahoe 26, watchOS 26 and tvOS 26, and Apple calls it its broadest software design update ever. Apple also provided updated programming interfaces for developers building apps.

The key point is the scope. This is Apple's design language for Apple's own devices and for apps built for them. It is not a web standard, and nothing in the announcement requires websites to follow it. A website opened in a browser is not an Apple app.

The risk: pretty but hard to read

Glass effects place text over a changing, blurred background, and readability suffers when the background gets busy. The W3C accessibility guideline on minimum contrast sets the bar: normal text needs a contrast ratio of at least 4.5 to 1 against its background, and large text at least 3 to 1. The same rule says a ratio of 4.499 to 1 fails, with no rounding. With a see-through panel, the real background keeps changing as the page scrolls, so the ratio can pass on one scroll position and fail on the next.

For a business site this has a plain cost. Opening hours, phone numbers, prices and "Book now" buttons are the content that earns money. If a customer on a sunny street, with the screen at low brightness, cannot read them, the design has failed, however modern it looks. A second cost is speed: heavy blur effects ask more of a mid-range Android phone, which is what many of your visitors carry.

What is worth borrowing

• Clear layers. Navigation that sits above content and stays out of the way is a good idea. Make the layer solid or lightly tinted enough that text on it always passes contrast.
• Soft, rounded shapes. Friendly corners and generous spacing help finger-sized targets and calm the page.
• Content-first layouts. Apple's own aim, as described in its release, is to let content stand out. Let your photos, prices and offers be the star.
• Light and dark readiness. Support both colour schemes properly, with checked contrast in each.
• Restrained motion. Small, meaningful animations, with a reduced-motion option, as discussed in our piece on page transitions.

What is only decoration

• Blurred, see-through cards laid over photographs or gradients behind body text.
• Thin grey text on a frosted panel.
• Shiny highlights and glows on every button, so that nothing stands out.
• Effects added because a competitor has them.

A clinic, a coaching centre or a hardware wholesaler does better with a clean page and strong readability than with a replica of a phone's home screen. Trends also age fast. A site built around a fashionable effect can look dated before its first yearly renewal.

Test on the phones your customers carry

Many shoppers in India use budget and mid-range Android phones, often with small screens, cracked protectors and screens used in bright daylight. A design tested only on a designer's new iPhone in an air-conditioned studio will not show these problems. Ask your designer to show the mock-up on the phones your customers actually carry, and to prefer plain, solid backgrounds behind anything a customer must read or tap.

A quick test before you approve a design

1. Open the mock-up on a mid-range Android phone outdoors, or turn the brightness down, and read the phone number and the main button.
2. Run the key text and background colours through a contrast checker and confirm the 4.5 to 1 and 3 to 1 limits.
3. Scroll the page slowly and check text over every part of the background, not just one.
4. Switch on the phone's reduce-motion and larger-text settings and see what happens.
5. Check the page speed score before and after adding the effect.

Our approach at VS Tech Builders

We design business websites to be read first and admired second. A little translucency in a navigation bar is fine, provided the text stays legible and the page stays quick. For the wider picture on how design choices affect customers, see our UI and UX articles, and our responsive design entry for the phone side. If you are planning a refresh and want an honest opinion on which trends to adopt, get in touch.

Sources

Checked on 3 November 2026. Technology changes quickly; always confirm details with the official source before you act on them.

• Apple introduces a delightful and elegant new software design — Apple Newsroom
• Understanding Success Criterion 1.4.3: Contrast (Minimum) — W3C Web Accessibility Initiative

Frequently asked questions

What is Apple's Liquid Glass?

It is Apple's design language, previewed on 9 June 2025, built around a translucent material that reflects its surroundings and adapts to light and dark settings. It appears in controls, navigation and icons across iOS 26, iPadOS 26, macOS Tahoe 26, watchOS 26 and tvOS 26. It is a design for Apple's own platforms.

Should my business website copy Liquid Glass?

Not directly. It is not a web standard, and transparent panels put text over changing backgrounds, which can fail contrast rules and slow older phones. Borrow the ideas of clear layers, soft shapes and content-first layouts, but keep key text on solid or lightly tinted backgrounds that you have tested for readability.

What contrast ratio should website text have?

The W3C's Contrast (Minimum) criterion requires at least 4.5 to 1 for normal text and 3 to 1 for large text, which means about 24 pixels regular or 18.5 pixels bold. Ratios are not rounded, so 4.499 to 1 fails. Test with a contrast checker, in light and dark modes.

How do I judge whether a design trend is worth following?

Ask whether it makes your key information easier to find and read, whether it works on a mid-range Android phone outdoors, and whether it slows the page. If it only adds decoration, skip it. Trends fade, but readable text, clear buttons and quick loading keep earning for years.