Physical metaphors
Skeuomorphism
A library webpage borrows shelves, tactile materials and physical control cues.
Web & app design
What should your interface feel like?
Explore surface treatments and control hierarchy through actual interface examples.
Generated UI concepts help you choose a visual direction. Working flows and interaction states need their own design.
Interface directions
7 visual directions · Generated examples
Glass & transparency
Liquid glass
Navigation layers bend the botanical background around their glossy rims.
Graphic interfaces
Neobrutalism
Heavy outlines and offset shadows keep the interface deliberately graphic.
Soft relief
Neumorphism
Soft raised buttons and inset tracks emerge from the same pale matte surface through paired light and dark shadows.
Glass & transparency
Glassmorphism
Frosted translucent cards, blurred color behind the panels, and fine borders create a layered glass interface.
Graphic interfaces
Material 3 Expressive
Expressive UI with bold contained shapes, color-led grouping, and a strong typographic hierarchy.
Physical metaphors
Early Macintosh bitmap interface
Early Macintosh bitmap interface with one-bit icon graphics, compact pixel typography, and sharp boxed window frames; a spare low-resolution desktop language with hand-drawn clarity.
Look beyond the surface
Skeuomorphism borrows cues from physical objects. Liquid glass uses refractive rims and background distortion. Neobrutalism emphasizes blunt borders, solid blocks and conspicuous controls. Compare hierarchy and readability as well as material.
These still images do not establish working behavior, accessibility or platform compliance.