Design reference index · 7/27
2153 source-linked definitions with individual URLs. JavaScript is not required to browse these documents.
Try 379 interactive reference cards
Repetition
Repeating colors, shapes, spacing, or styles to create consistency and predictability.
Balance
Arranging visual weight so it does not concentrate excessively on one side.
Symmetry
A stable composition using corresponding elements around an axis or center.
Asymmetry
A composition balancing contrasting elements of unequal size or placement.
Rhythm
Using repetition and varied spacing to give eye movement a pattern and pace.
Negative Space
Empty space within or around shapes that supports distinction and balance.
Figure–Ground
The perceptual relationship separating a subject of attention from its background.
Gestalt Closure
The tendency to perceive an incomplete outline as a complete shape.
Gestalt Continuity
The tendency to group elements along a continuous line or directional flow.
Common Region
The principle that elements sharing a boundary or background are perceived as related.
Focal Point
The location designed to attract the first or strongest visual attention.
Rule of Thirds
A composition guideline that places subjects along thirds of the image's width and height.
Golden Ratio
A proportion of approximately 1:1.618, used as one possible reference for composition.
Leading Lines
Lines, paths, or arrangements that direct the eye toward a subject.
Framing
Surrounding a subject with other elements to focus attention and establish context.
Silhouette
The outer shape by which an object can be recognized without internal detail.
Shape Language
Communicating character through recurring shapes such as circles, triangles, and squares.
Visual Weight
An element's relative ability to attract attention through size, contrast, color, and density.
Optical Alignment
Adjusting alignment to appear balanced to the eye rather than relying only on mathematical centering.
Optical Size
Adjusting letter or icon detail, strokes, and internal space for legibility at its actual display size.
Visual Density
The concentration of information and visual elements within a given area.
Art Direction
Coordinating color, form, lighting, typography, and other visual elements around a common intent.
Typeface
A system of letter designs sharing consistent visual principles.
Font
A typeface resource or file implementing a particular style, weight, or related variation.
Serif
A typeface category with small finishing strokes at the ends of letter strokes.
Sans Serif
A typeface category without serif finishing strokes.
Monospace
A font assigning the same horizontal advance width to each character.
Display Typeface
A typeface intended primarily for large headings or posters rather than long body text.
Kerning
Adjusting the spacing between a particular pair of letters.
Tracking
Uniformly increasing or decreasing spacing across a run of text.
Leading
The distance between the baselines of successive lines of text.
Baseline
The reference line on which the main bodies of letters sit.
x-height
The height of lowercase bodies, conventionally measured using the letter x.
Cap Height
The nominal height of capital letters measured upward from the baseline.
Variable Font
Font technology that allows continuous changes along supported axes within a single font file.
Ligature
A single connected glyph representing two or more letters.
Glyph
The drawn form of a character or symbol; in UI terminology, also a compact monochrome icon.
Widow and Orphan
Typesetting problems in which a line or short word is isolated at a paragraph or page boundary.
Baseline Grid
A grid aligning text baselines across blocks at regular intervals.
Hue
The property distinguishing color families such as red and blue.
Saturation
A measure of how vivid a color is or how close it is to gray.
Value / Lightness
How light or dark a color appears; the precise definition depends on the color model.
Complementary Colors
Colors positioned opposite each other on the chosen color wheel.
Analogous Colors
A palette combining colors located near one another on the color wheel.
Monochromatic Palette
A palette based on one hue with variations in lightness and saturation.
Accent Color
A color used selectively to draw attention to key actions or important elements.
Semantic Color
A color associated with a status meaning, such as error, success, or warning.
RGB
An additive color model combining red, green, and blue light.
CMYK
A print-oriented color model using cyan, magenta, yellow, and black ink.
Color Gamut
The range of colors a device or color space can represent.
Color Profile
Characterization data used to manage color reproduction between devices and color spaces.
OKLCH
An OKLab-family color space expressing color through perceptual lightness, chroma, and hue.
Duotone
A technique representing image tones using two colors or ink families.
Gradient
A continuous transition between two or more colors or opacity values.
Minimalism
An approach reducing decoration to emphasize space, structure, and essential information.
Maximalism
An approach layering abundant colors, patterns, objects, and information for a strong impression.
Swiss / International Style
A graphic design tradition emphasizing grids, sans-serif type, and clear information structure.
Bauhaus-inspired Design
A visual approach using geometric forms and function-oriented composition.
Brutalist Web Design
A web aesthetic emphasizing raw structure, exposed basic elements, and rejection of conventional polish.
Neo-brutalism
A digital visual style using heavy borders, strong colors, and flat, offset shadows.
Flat Design
A style emphasizing flat colors and simple shapes over dimensional ornament.
Skeuomorphism
An approach that imitates physical materials, tools, or their interaction cues in a digital interface.
Neumorphism
A style using light and dark shadows on similarly colored surfaces to suggest raised or recessed forms.
Claymorphism
A digital style using soft, rounded forms and clay-like material qualities.
Bento Layout
A composition arranging cards of different sizes and proportions into an orderly grid.
Editorial Design
Designing reading order through typography, imagery, and space, as in magazines or articles.
Y2K Aesthetic
A reinterpretation of turn-of-the-millennium digital culture through chrome, gloss, and exaggerated graphics.
Retro-futurism
An aesthetic reconstructing technology and visual languages from past visions of the future.
Cyberpunk Aesthetic
A futuristic visual treatment using dense cities, technology, neon, and strong contrast.
Solarpunk Aesthetic
An aesthetic envisioning an optimistic future combining nature, community, and regenerative technology.
Art Deco
A decorative style using geometric ornament, symmetry, and stepped forms.
Art Nouveau
A decorative style featuring botanical motifs and organic curves.
Memphis Style
A decorative approach combining bold colors, geometric shapes, and irregular patterns.
Organic Design
An approach using nature-inspired curves, irregular forms, and soft connections.
Pixel Art
A graphics technique that deliberately places individual pixels to define shape, color, and shading.
Voxel Art
A visual approach constructing forms from three-dimensional grid cells called voxels.
Low-poly Style
A 3D style using few polygons and distinct faces as an aesthetic choice.
Cel Shading
Rendering that divides smooth shading into limited bands for a cartoon-like appearance.
Hand-painted Style
A texture or illustration style emphasizing brushwork and manually painted shading.
Photorealism
A visual approach seeking photographic fidelity in materials, lighting, and form.