# Shadowed surfaces design examples

[Open the live Fudge conversation](https://design.withfudge.com/share/designs-with-visual.surface.shadowed)

Last updated: 2026-08-01

Explore website designs that use **Shadowed surfaces**.

## Captured pages

[![Dia | A browser you won't dread opening](https://pin.fontofweb.com/10603?format=jpg)](https://design.withfudge.com/share/pin-10603)

[Dia | A browser you won't dread opening](https://design.withfudge.com/share/pin-10603)

[![Redreach: AI-Powered Reddit Lead Generation Tool | Redreach: AI-Powered Reddit Lead Generation Tool](https://pin.fontofweb.com/10186?format=jpg)](https://design.withfudge.com/share/pin-10186)

[Redreach: AI-Powered Reddit Lead Generation Tool | Redreach: AI-Powered Reddit Lead Generation Tool](https://design.withfudge.com/share/pin-10186)

[![Autogram](https://pin.fontofweb.com/10168?format=jpg)](https://design.withfudge.com/share/pin-10168)

[Autogram](https://design.withfudge.com/share/pin-10168)

[![HeroUI Pro — Premium React & React Native UI Components, Templates & AI Tooling | HeroUI Pro](https://pin.fontofweb.com/8795?format=jpg)](https://design.withfudge.com/share/pin-8795)

[HeroUI Pro — Premium React & React Native UI Components, Templates & AI Tooling | HeroUI Pro](https://design.withfudge.com/share/pin-8795)

[![SaaS Product Analytics Dashboard - Moda](https://pin.fontofweb.com/8310?format=jpg)](https://design.withfudge.com/share/pin-8310)

[SaaS Product Analytics Dashboard - Moda](https://design.withfudge.com/share/pin-8310)

[![Moda | AI designs and presentations | Moda](https://pin.fontofweb.com/8305?format=jpg)](https://design.withfudge.com/share/pin-8305)

[Moda | AI designs and presentations | Moda](https://design.withfudge.com/share/pin-8305)

[![Log In | DeviantArt](https://pin.fontofweb.com/7789?format=jpg)](https://design.withfudge.com/share/pin-7789)

[Log In | DeviantArt](https://design.withfudge.com/share/pin-7789)

## Related design patterns

- [Primary text color](/share/designs-with-color.role.text_primary)
- [Normal state](/share/designs-with-interaction.data_state.normal)
- [Sans serif](/share/designs-with-typography.generic.sans_serif)
- [Display role](/share/designs-with-typography.role.display)
- [UI role](/share/designs-with-typography.role.ui)
- [AI enabled](/share/designs-with-capability.ai_enabled)

## Related website guides

- [autogram.id design guide](/share/autogram.id-design)
- [heroui.pro design guide](/share/heroui.pro-design)
- [moda.app design guide](/share/moda.app-design)
- [redreach.ai design guide](/share/redreach.ai-design)
- [diabrowser.com design guide](/share/diabrowser.com-design)