Vibe Coding Glossary.
Stop getting confused when developers talk. Browse our A-Z dictionary of core terms you need to know when working with AI.
A
Accordion
A vertical stack of interactive headings used to toggle the display of further information. Keeps the page clean without hiding important content. See Accordion Component
Agentic AI
AI systems that don't just answer questions, but can take actions, use tools (like writing files or searching the web), and follow a plan to achieve a goal autonomously.
Alert
A way of informing the user of important changes, errors, or warnings in a prominent way without completely interrupting their workflow. See Alert Component
Artifacts
Standalone pieces of content generated by the AI - like a full HTML file, a React component, or a Markdown document. Useful because you can copy them whole instead of picking apart a chat response.
Avatar
A graphical representation of a user: usually a photo, illustration, or their initials. Often found in headers or comment sections. See Avatar Component
B
Bento Grid
A layout style inspired by Japanese bento boxes, using a grid of varying-sized rounded rectangles to display content hierarchically and neatly.
Breadcrumbs
A secondary navigation scheme that reveals the user's location in a website or web application. See Breadcrumbs Component
Button
An interactive element that triggers an action when clicked. See Button Component
C
Context Window
The maximum amount of text (tokens) an AI can process in one go. If your prompt is too long or you've been chatting too much, the AI 'forgets' earlier instructions and output quality drops drastically.
CSS Variables (Custom Properties)
Tokens defined in CSS (e.g., --forest: #1C3D2E) that allow you to change colors or spacing globally across an entire site simply by updating one value.
D
Dark Mode
An alternate theme using light text on a dark background. Build it using CSS variables from day one so you don't have to rewrite everything later.
Design Tokens
The variables that define your visual language - colors, spacing, font sizes, border radii. In CSS: --color-primary, --space-md. Tokens make systems scalable and consistent.
F
Few-Shot Prompting
Providing the AI with a few examples of what you want before asking it to do the task. For example, showing it a button design before asking it to build a full form. Always better than Zero-Shot.
G
Glassmorphism
A frosted-glass effect created with background blur (backdrop-filter), semi-transparent fills, and a subtle white border. Makes elements feel layered and modern.
H
Hallucination
When the AI confidently makes something up. In coding, this often looks like using CSS classes that don't exist in your framework, or calling functions that haven't been written.
M
Micro-animations
Tiny, intentional transitions - button hover states, fade-ins, slide-ups. They make an interface feel alive without being distracting. 150–300ms is the sweet spot.
N
Negative Space
The empty space between and around elements. More whitespace = higher perceived quality. Never fill every pixel - breathing room is a design decision.
Neumorphism
Elements that look pushed into or extruded from the background. Achieved with two-sided box shadows - one light, one dark. Very tactile, best used sparingly.
P
Prompt Chaining
Breaking a complex task into sequential prompts. Instead of 'build a website', ask it to 'build the HTML', then 'add CSS', then 'add interactions'.
R
Responsive Design
A layout that adapts cleanly to all screen sizes using relative units, flexbox, grid, and media queries. Mobile-first is the standard - design small, then scale up.
S
Spacing System
A set of consistent spacing values (e.g., 4px, 8px, 16px, 24px, 32px). Padding, margins, and gaps should always come from this scale - never random px values.
T
Token Limit
Similar to context window, but specifically refers to the hard limit on the number of tokens (words/pieces of words) the AI can read or generate in a single request.
Typography Scale
A set of font sizes based on a mathematical ratio (e.g., 1.25). Defines h1 through body text so your hierarchy always feels proportional, not arbitrary.
V
Vibe Coding
The act of using natural language to direct AI agents to build software for you. You provide the 'vibe' (the design intent, the logic flow), and the AI handles the syntax.
Z
Zero-Shot Prompting
Asking the AI to do a task without giving it any examples. It relies entirely on its pre-trained knowledge. Good for simple tasks, risky for complex designs.