Design Glossary

The positioning of elements in relation to each other or to a page. Common types include left, right, center, and justified alignment. Proper alignment creates visual order and improves readability.

Colors that are adjacent to each other on the color wheel, such as blue, blue-green, and green. They create harmonious color schemes with low contrast.

The proportional relationship between width and height of an image or screen, expressed as two numbers separated by a colon (e.g., 16:9, 4:3). Maintaining aspect ratio prevents distortion when resizing.

The act of crediting the creator or source of a work. Many Creative Commons licenses require attribution when using assets.

The invisible line upon which most letters sit in typography. Descenders (like in 'g' and 'y') extend below the baseline.

A mathematical curve used in vector graphics to create smooth, scalable shapes. Named after Pierre Bézier, these curves are fundamental to tools like the Pen tool in design software.

A raster image composed of a grid of pixels, where each pixel contains color information. Common bitmap formats include PNG, JPG, and GIF. Unlike vectors, bitmaps lose quality when scaled up.

The area of a design that extends beyond the trim edge of a printed piece. Typically 1/8 inch (3mm), bleed ensures no white edges appear after trimming.

The visible elements of a brand, including logo, colors, typography, and imagery, that together identify and distinguish the brand in consumers' minds.

Cyan, Magenta, Yellow, and Key (Black) - the four-color printing process used for most color printing. CMYK is a subtractive color model, unlike RGB which is additive.

The study of how colors interact, mix, and affect human perception. Includes concepts like the color wheel, color harmony, and color psychology.

Colors opposite each other on the color wheel (e.g., red and green, blue and orange). They create high contrast and vibrant looks when used together.

The arrangement of visual elements in a design. Good composition guides the viewer's eye and creates visual hierarchy, balance, and harmony.

The difference between elements in a design, such as light vs. dark, large vs. small, or rough vs. smooth. Contrast creates visual interest and improves readability.

A licensing system that allows creators to grant specific usage rights to their work. CC licenses range from very permissive (CC0) to restrictive (CC BY-NC-ND).

A measure of printing resolution indicating how many dots of ink are placed in a linear inch. Higher DPI means better print quality. Standard is 300 DPI for print, 72 DPI for web.

An image created using two contrasting colors, typically one dark and one light. Popular for creating stylized, artistic effects.

A vector graphics file format commonly used for logos and illustrations. EPS files can be scaled infinitely without quality loss and are widely supported by design software.

A relative unit of measurement in typography equal to the current font size. If the font size is 16px, 1em equals 16px. Useful for creating scalable, responsive designs.

A specific size, weight, and style of a typeface. For example, 'Arial Bold 12pt' is a font, while 'Arial' is the typeface family.

A group of fonts that share common design features but vary in weight, width, and style (e.g., Arial Regular, Arial Bold, Arial Italic).

The thickness of characters in a typeface, ranging from thin (100) to black (900). Common weights include regular (400) and bold (700).

A gradual transition between two or more colors. Can be linear (straight line) or radial (circular). Used to add depth and visual interest.

A structure of intersecting vertical and horizontal lines used to organize content. Grids create consistency, alignment, and visual hierarchy in designs.

A specific character or symbol in a font, including letters, numbers, punctuation, and special characters. A single character may have multiple glyphs (e.g., regular 'a' vs. stylistic 'a').

A six-digit code representing colors in web design, preceded by a hash symbol (e.g., #FF5733). The first two digits represent red, middle two green, and last two blue values.

The arrangement of elements to show their order of importance. Visual hierarchy guides viewers through content using size, color, contrast, and positioning.

The pure color without tint (white added) or shade (black added). Hue is what we typically think of as 'color' - red, blue, green, etc.

A simplified graphic symbol representing an object, action, or concept. Icons should be simple, recognizable, and consistent in style.

The process of repeatedly refining a design through multiple versions. Each iteration incorporates feedback and improvements.

A compressed raster image format ideal for photographs. Uses lossy compression, meaning some quality is lost to reduce file size. Not suitable for images requiring transparency.

Text alignment where both left and right edges are flush with the margins, creating straight edges on both sides. Achieved by adjusting spacing between words.

The adjustment of space between individual letter pairs to achieve visually pleasing spacing. Different from tracking, which adjusts spacing uniformly across all characters.

A printing technique where one color is removed from an area so another color can be printed in its place, preventing color mixing.

The vertical space between lines of text, measured from baseline to baseline. Named after the lead strips used in traditional typesetting. Proper leading improves readability.

Legal permission to use a creative work under specific conditions. Common types include royalty-free, rights-managed, and Creative Commons licenses.

A graphic mark, emblem, or symbol used to identify a company, organization, or brand. Can be text-based (logotype), symbol-based (logomark), or combination.

A compression method that reduces file size without losing any data or quality. PNG uses lossless compression, making it ideal for graphics with sharp edges.

A compression method that reduces file size by permanently removing some data. JPEG uses lossy compression, which is why repeated saving degrades quality.

A realistic representation of how a design will look in its final context, such as a logo on a business card or a design on a t-shirt.

A color scheme using variations of a single hue, including its tints, shades, and tones. Creates cohesive, sophisticated designs.

A typeface where each character occupies the same horizontal space. Commonly used for code and tabular data (e.g., Courier, Consolas).

The empty space around and between design elements. Also called white space, it's crucial for creating breathing room and improving readability.

The degree to which an element is transparent or opaque, measured from 0% (fully transparent) to 100% (fully opaque). Used to create layering effects.

A single word or short line appearing alone at the end of a paragraph or column. Considered poor typography and should be avoided.

A selected range of colors used in a design. A well-chosen palette creates harmony and reinforces brand identity.

A standardized color matching system used in printing. Pantone colors ensure consistent color reproduction across different materials and printers.

A raster image format supporting transparency and lossless compression. Ideal for graphics, logos, and images requiring transparent backgrounds.

A measure of screen resolution indicating pixel density. Higher PPI means sharper images on screens. Retina displays typically have 220+ PPI.

Creative works not protected by copyright, either because protection has expired or the creator has waived rights. Can be used freely without permission.

Images composed of pixels in a grid. Quality depends on resolution - enlarging raster images causes pixelation. Formats include JPG, PNG, GIF.

The amount of detail in an image, measured in pixels (for screens) or DPI (for print). Higher resolution means more detail and larger file sizes.

Red, Green, Blue - the additive color model used for digital displays. Colors are created by combining different intensities of these three colors.

A licensing model where you pay once to use an asset multiple times without additional fees. Different from rights-managed licensing.

Typefaces without decorative strokes (serifs) at the ends of letters. Examples include Arial, Helvetica, and Futura. Generally considered more modern and clean.

The intensity or purity of a color. Highly saturated colors are vivid and bright, while desaturated colors appear more gray or muted.

Typefaces with small decorative strokes at the ends of letters. Examples include Times New Roman, Georgia, and Garamond. Often used for body text in print.

An XML-based vector image format for web graphics. SVGs scale infinitely without quality loss and can be animated and styled with CSS.

A pre-designed file serving as a starting point for creating similar designs. Templates save time and ensure consistency across projects.

The perceived surface quality of a design element. Can be visual (appearing textured) or tactile (actually textured in physical designs).

The uniform adjustment of space between all characters in a block of text. Increases or decreases overall spacing, unlike kerning which adjusts specific pairs.

The quality of being see-through. In digital design, transparency is controlled by alpha channels, allowing elements to show through each other.

A family of fonts sharing common design features. For example, 'Helvetica' is a typeface, while 'Helvetica Bold 12pt' is a specific font.

The art and technique of arranging type to make written language legible, readable, and visually appealing. Encompasses font choice, sizing, spacing, and layout.

The visual elements through which users interact with a digital product, including buttons, menus, icons, and layouts.

The overall experience a person has when interacting with a product or service. Good UX is intuitive, efficient, and satisfying.

Graphics created using mathematical equations rather than pixels. Vectors scale infinitely without quality loss. Common formats include SVG, EPS, and AI.

The arrangement of elements to indicate their relative importance. Achieved through size, color, contrast, spacing, and positioning.

A semi-transparent mark or logo overlaid on an image to indicate ownership or prevent unauthorized use. Often removed after purchase.

The thickness of strokes in a typeface, ranging from thin to black. Common weights include light, regular, medium, bold, and black.

Empty space in a design, not necessarily white in color. Essential for creating breathing room, improving readability, and focusing attention.

A basic visual guide showing the skeletal framework of a website or app. Wireframes focus on layout and functionality rather than visual design.

The height of lowercase letters (specifically the letter 'x') in a typeface, excluding ascenders and descenders. Affects readability and visual appearance.