A simple glossary of common design terms
Why design terminology matters for beginners
When you first step into the world of design, the language can feel like a barrier. Conversations are peppered with words like "kerning," "bleed," and "hierarchy," and it can seem as though everyone else received a secret handbook you missed. The good news is that most design terms describe simple, practical ideas. Once you connect a word to what it actually does, the mystery disappears.
Learning the vocabulary matters for a few reasons. First, it helps you communicate clearly. If you can tell a designer you want "more contrast between the headline and the body text," you'll get better results than if you say something vague like "make it pop." Second, understanding terms lets you follow tutorials, feedback, and instructions without getting stuck. Many beginners abandon a helpful guide simply because it used a word they didn't recognize.
Think of design terminology as a shared toolkit. You don't need to memorize every term at once. Instead, aim to recognize the words you encounter most often and understand the idea behind each one. This glossary walks through the terms that come up again and again, grouped by topic so you can find them easily. Treat it as a reference you can return to whenever a new word appears in your reading or in a conversation.
Layout and composition terms
Layout is how elements are arranged on a page or screen. The terms in this area describe the structure that holds a design together.
A grid is an invisible framework of columns and rows that helps you align elements consistently. Designers use grids so that text, images, and buttons line up in a way that feels orderly. Alignment simply means how elements line up with each other — left-aligned text, for example, starts each line at the same left edge.
White space (also called negative space) is the empty area around and between elements. It isn't wasted space; it gives the eye room to rest and makes a design feel uncluttered. A crowded layout often just needs more white space.
Hierarchy describes the order in which your eye moves through a design. A large, bold headline sits at the top of the hierarchy; smaller captions sit near the bottom. Good hierarchy guides the reader to the most important information first. Balance refers to how visual weight is distributed. A layout feels balanced when no single side feels heavier or more crowded than the other.
Finally, margins are the spaces around the outer edge of a design, and padding is the space inside an element, between its content and its border. For example, a button with generous padding gives its label breathing room so it doesn't touch the edges.
Typography terms you'll hear often
Typography is the art of arranging text. Because words appear in nearly every design, these terms come up constantly.
A typeface is a family of letter designs, like Helvetica or Georgia. A font technically refers to a specific weight and size within that family, though in everyday use people treat the two words as interchangeable. Typefaces fall into broad categories: serif fonts have small feet or strokes at the ends of letters (think of traditional book text), while sans-serif fonts do not (they look cleaner and more modern).
Kerning is the spacing between two individual letters, while tracking adjusts the spacing across a whole word or line evenly. Leading (pronounced "ledding") is the vertical space between lines of text. Too little leading makes paragraphs feel cramped; too much makes them feel disconnected.
Other useful terms include weight, which describes how thick or thin the strokes are (light, regular, bold), and point size, the measurement of how large the text is. Line length, sometimes called measure, is how wide a block of text runs. A comfortable line length keeps reading easy — very long lines make it hard for the eye to find the next line. Understanding these terms lets you fine-tune text so it's both attractive and easy to read.
Color and visual terms explained
Color is one of the most expressive tools in design, and it has its own set of terms.
Hue is what most people simply call "color" — red, blue, green, and so on. Saturation describes how vivid or muted a color is; a highly saturated red is bold and intense, while a desaturated red looks dusty and soft. Value (or brightness) refers to how light or dark a color is.
Contrast is the difference between elements, most often between light and dark. Strong contrast, like dark text on a light background, makes content easy to read. Low contrast can look elegant but may be hard to see. Palette is the set of colors chosen for a design. A well-chosen palette usually contains a few colors that work well together rather than many competing ones.
You may also encounter complementary colors, which sit opposite each other on the color wheel and create lively contrast, and analogous colors, which sit next to each other and feel harmonious. Tint means a color mixed with white to make it lighter, while shade means a color mixed with black to make it darker. Knowing these words helps you describe exactly what you want when adjusting a color scheme.
Image and file format terms
Designs are saved and shared as files, and understanding the common formats saves a lot of confusion.
Images come in two main types. Raster images are made of tiny squares called pixels — photographs are the classic example. When you enlarge a raster image too much, it becomes blurry or blocky. Vector images are made of mathematical paths, so they can scale to any size without losing quality. Logos are often built as vectors for this reason.
Resolution measures how much detail an image contains, often described in pixels or in DPI (dots per inch) for print. Compression reduces file size, sometimes at the cost of quality. Common formats each have a purpose: JPEG suits photographs, PNG supports transparency and crisp graphics, SVG is a scalable vector format, and PDF preserves a layout exactly across devices.
Transparency means part of an image is see-through, letting the background show through where there's no content. The table below summarizes the most common formats and when to use each.
Process and workflow terms
Beyond individual elements, design has words that describe how work moves from idea to finished piece.
A wireframe is a simple, stripped-down sketch that shows structure without color or detail — like a blueprint. A mockup is a more polished, realistic version that shows how the final design will look. A prototype goes further, letting people click or interact to test how something works.
Iteration means creating a version, gathering feedback, and improving it — repeating the cycle until the design is right. Feedback is the input you receive from clients, colleagues, or users. A brief is the document or conversation that outlines the goals, audience, and requirements before work begins; a clear brief prevents wasted effort.
You'll also hear deliverables, which are the final files or items you hand over, and revisions, the rounds of changes made along the way. Understanding these process terms helps you know what stage a project is in and what's expected next. For example, if someone asks for "one more round of revisions on the mockup," you now know exactly what they mean.
How to keep learning design vocabulary
No single glossary can cover every term, and design language keeps growing as tools and trends change. The goal isn't to memorize everything but to build a habit of curiosity.
When you meet a new word, look it up right away and, if you can, find a visual example. Design terms stick better when you can see them in action — comparing serif and sans-serif fonts side by side teaches more than any definition alone. Keep a personal note or list of terms you've learned, adding to it whenever something new comes up.
Practice using the words in real conversations and feedback. Saying "the hierarchy feels off" or "this needs more white space" cements the vocabulary far faster than reading. Follow tutorials and articles slowly, pausing to understand each unfamiliar term rather than skipping ahead. Over time, the language that once felt intimidating will become second nature, and you'll find yourself reading design discussions with ease and describing your own ideas with confidence.
Example
Common image and file formats and their typical uses
| Format | Type | Best for |
|---|---|---|
| JPEG | Raster | Photographs and detailed images |
| PNG | Raster | Graphics needing transparency or crisp edges |
| SVG | Vector | Logos and icons that scale to any size |
| Document | Sharing layouts that must look the same everywhere | |
| GIF | Raster | Simple animations and limited-color graphics |
FAQ
What's the difference between a typeface and a font? A typeface is the overall design family, such as Helvetica, while a font is a specific style and size within that family, like Helvetica Bold at 12 points. In everyday conversation, most people use the words interchangeably, so you don't need to worry too much about the distinction as a beginner.
Do I need to memorize all these design terms at once? No. It's better to recognize the terms you encounter most often and understand the idea behind each one. Use this glossary as a reference and return to it whenever a new word appears. The vocabulary will stick naturally as you read tutorials, give feedback, and work on real designs.
What is the difference between raster and vector images? Raster images are made of pixels and can look blurry when enlarged too much, which makes them ideal for photographs. Vector images are built from mathematical paths, so they scale to any size without losing quality, which is why logos and icons are usually created as vectors.
Why is white space important in a design? White space, the empty area around and between elements, gives the eye room to rest and makes a design feel clean and organized. It isn't wasted space — a crowded, hard-to-read layout often improves simply by adding more white space around its elements.
Read next
Read more