← Back
Best viewed on a desktop. Please switch to a larger device.

Skeuo-
morphism

The design language that made software feel like objects you could touch. Every surface borrowed from the physical world - leather stitching, felt, brushed metal, and ruled paper.

Real
Textures
iOS 6
Peak Era
Touch
Metaphor
Design Principles
A design language where every pixel earns its place by imitating the physical world it represents.
Page 1 of 12
Brushed Aluminium
System Preferences
Settings · Controls
Baize Felt
Game Center
Card table aesthetic
Materials

Texture Library

Skeuomorphism borrows from the physical world - each material communicates function through familiar tactile associations.

Stitched Leather
Used in calendars, address books, notebooks. Communicates premium personal organisation.
background + stitching pattern
Brushed Aluminium
System panels, toolbars, utility apps. Signals precision engineering and Apple industrial design.
linear-gradient + specular
Baize Felt
Game Center, card tables. The felt surface physically grounds competitive and recreational contexts.
dot-pattern + colour wash
Wood Grain
Newsstand, photo frames. Warm and domestic - communicates living space and curated collections.
repeating-linear-gradient
Components

UI Components

Bevelled Buttons

Inset Text Fields

Switches & Progress

Progress Bars
Downloading… 72%
Storage Used 45%
Battery 89%
Icons

App Icon Style

Rounded rectangles with gloss overlays, depth, and material textures. Each icon is a miniature physical object.

📝
Notes
📅
Calendar
✉️
Mail
🗺️
Maps
🎵
Music
⚙️
Settings
Navigation

Navigation Patterns

Toolbar Navigation
Layout

Full Application Layout

Dashboard - My Account
📊 Overview
📁 Documents
📷 Photos
🎵 Music
🔔 Alerts
⚙️ Settings

Overview

📁
1,284
Documents
📷
4,821
Photos
💾
48.2 GB
Storage Used
Storage
Principles

Core Principles

01 · Material

Borrow from the Physical

Every UI surface quotes a real-world material - leather, paper, felt, or metal. The user's existing knowledge of these materials guides interaction.

02 · Depth

Light, Shadow, Bevel

Shadows ground elements in space. Bevels and gradients suggest three-dimensional form. Every button looks pressable, every switch looks flippable.

03 · Affordance

Appearance Dictates Function

Visual appearance directly communicates how an element works. A button that looks raised invites pressing. A switch that looks physical invites flicking.

04 · Trust

Familiar Metaphors

By mimicking objects users already know, skeuomorphic design reduces the cognitive load of learning new software. Comfort breeds trust.