Material Design vs Apple's Human Interface Guidelines in 2026

Google says Material 3 Expressive rests on 46 research studies with more than 18,000 participants. Apple's redesign from the same year centers on a single material, Liquid Glass, which Apple says unifies its design language across platforms. Both are serious design languages, and neither one is your product's design system.

Material Design is Google's design system, with code for Android, Flutter, and the web; its current form is Material 3 with the Expressive update. Apple's Human Interface Guidelines (HIG) are Apple's design guidance for all its platforms, and their current visual language is built on Liquid Glass. Material gives you a customizable system to theme. The HIG asks you to build on system components that adapt for you.

Material Design vs Apple HIG at a glance

As of October 2026.

How do Material and Apple think about design?

Material wants you to express yourself. Its Expressive research found that participants spotted key UI elements up to four times faster on expressive screens, and the update gives you more ways to create hierarchy: bolder shapes, emphasized type, richer color, and spring-based motion.

Apple wants you to feel native. In June 2026 it reintroduced eight design principles for every platform: Purpose, Agency, Responsibility, Familiarity, Flexibility, Simplicity, Craft, and Delight. Familiarity shows up across the HIG, which keeps pointing you to system components and established patterns.

In short, Material hands you a kit of expressive parts and expects you to theme it. The HIG hands you the platform and expects you to fit into it.

What changed: Material 3 Expressive and Liquid Glass

Material 3 Expressive

Material 3 Expressive, introduced in 2025, added new features, components, and design tactics to Material 3:

• A motion-physics system built on springs, for movement and for color and opacity effects.
• Emphasized type styles for headlines and key actions.
• A library of 35 shapes with built-in shape morphing.
• New components, including button groups, a FAB menu, a loading indicator, a split button, and toolbars.

At Google I/O 2026, Material added the Expressive layout system, a scaffold for adapting screens across mobile, desktop, and spatial devices, plus a spacing system on an 8dp scale and guidance for watches and XR. It also declared Material Android Compose-first.

Liquid Glass

Apple added Liquid Glass to the HIG on June 9, 2025. It forms a functional layer for controls and navigation, such as tab bars and sidebars, that floats above the content layer. It comes in regular and clear variants, and standard components from the system frameworks pick it up automatically.

Apple also sets limits. Keep Liquid Glass out of the content layer, and use it sparingly on custom controls. Its appearance can change when people turn on settings that reduce transparency or increase contrast.

How do components, theming, and accessibility compare?

Material's components live in code you configure. Compose is built in-house and gets Material updates first; Flutter's library is maintained by the Flutter team; the Android Views and web libraries no longer receive feature updates. Theming runs through color roles (primary, secondary, tertiary), dynamic color, and tokens such as the new spacing tokens.

Apple's components are the system frameworks themselves: SwiftUI, UIKit, and AppKit. Theming is lighter: Apple asks you to prefer system-defined colors, whose accessible variants adapt when people switch to dark appearance or turn on Increase Contrast.

On accessibility, both are thorough:

• Material calls accessibility by default a core design value, documents requirements across its component pages, and treats WCAG minimums as a starting point.
• Apple gives numbers: contrast of 4.5:1 for text up to 17 pt and 3:1 for 18 pt or bold, from WCAG Level AA; a 44x44 pt default control size on iOS; and, ideally, text that can grow by at least 200 percent.

For Figma, Material offers its Design Kit. Apple publishes UI kits for Figma and Sketch, currently iOS and iPadOS 27 and macOS 27, alongside SF Symbols (over 7,000 symbols) and Icon Composer for layered Liquid Glass icons.

Platform guidelines describe the platform, not your product.

Why do product teams need their own design system on top?

Platform guidelines describe the platform, not your product. Neither Material nor the HIG gives you your brand's type and color decisions, a pricing table, a data dashboard, an onboarding flow, or a web app that matches your iOS and Android apps. Apple's system components adopt Liquid Glass automatically; the custom layer is yours to design.

Use this sort to decide what your system has to cover.

Inherit, adapt, own

1. Inherit. System navigation, sheets, pickers, keyboards, and gestures. Use the platform component as is, and document which one.
2. Adapt. Buttons, inputs, lists, and cards. Keep the platform's structure and behavior, and apply your tokens for color, type, and radius.
3. Own. Dashboards, charts, pricing, onboarding, and empty states. Your design system defines these completely, in Figma and in code.

Everything in "own" and most of "adapt" belongs in your design system, with tokens that map to each platform. Everything in "inherit" needs only a note. Skip the sort and you end up restyling controls you should have inherited.

Where Pegasus fits

Pegasus is a starting point for the product layer that sits above Material and the HIG. Its Figma library holds 1,540 components for web and native mobile, with light and dark variants of every component. The 84 example templates include native app screens, dashboards, landing pages, and sign-up and login flows, which give the "own" bucket a starting point.

The 470 design tokens (color, type, spacing, radius, shadow) live as Figma variables with light and dark modes, and one token source also themes the React code's theme object. That makes the "adapt" bucket a token change rather than a redesign. On the web, the React components are built in TypeScript on shadcn/ui, Base UI primitives, recharts, and Tailwind CSS, with Storybook stories and tests and a local MCP server for AI tools.

Pegasus is built to WCAG 2.1 AA, with keyboard paths, focus states, and contrast documented per component. As of October 2026, the Figma library is $79 and the full system $149, both one-time.

FAQ

What is Material 3 Expressive?

Material 3 Expressive is an update to Google's Material 3 design system, introduced in 2025. It adds a spring-based motion-physics system, emphasized typography, a library of 35 shapes with shape morphing, and new and updated components such as button groups and toolbars. Google states that it is not a new version of Material and not "M4."

What is Liquid Glass?

Liquid Glass is the dynamic material at the center of Apple's current design language, added to the Human Interface Guidelines in June 2025. It forms a translucent layer for controls and navigation, such as tab bars and sidebars, that floats above app content. Standard components in SwiftUI, UIKit, and AppKit adopt it automatically, and Apple advises using it sparingly on custom controls.

Should my Android app follow Material and my iOS app follow the HIG?

For platform controls, yes: navigation, sheets, pickers, and gestures should feel native, so follow each platform's guidance. Your brand, domain components, and web app need a shared product layer above both, so the same tokens and components describe your product everywhere while each platform keeps its conventions.

Sources

• Start building with Material 3 Expressive, Material Design (2025)
• What's new at Google I/O 2026, Material Design (2026)
• Develop with Material Design 3, Material Design (2026)
• Accessibility overview, Material Design (2026)
• Materials, Apple Human Interface Guidelines (2026)
• Design principles, Apple Human Interface Guidelines (2026)
• Accessibility, Apple Human Interface Guidelines (2026)
• Apple Design Resources, Apple (2026)