A design approach that starts with the mobile experience and progressively enhances for larger screens. Mobile-first forces prioritization and ensures the smallest screens get the best experience, not a squeezed afterthought. This approach often results in cleaner, more focused designs at all screen sizes.

A CSS unit equal to 1% of the browser viewport width, enabling fluid sizing relative to screen width. Vw units are useful for responsive typography and full-width elements. Combine with max-width constraints for practical maximum sizes. See Relative, fixed, and viewport Sizing in Framer.

The horizontal measurement of an element, definable as fixed pixels, percentages, or content-based sizing. Responsive designs often use percentage or max-width rather than fixed widths for flexibility. Framer's sizing controls support fixed, relative, and content-based width options.

The point at which content becomes hidden until the user scrolls, varying by device and browser window size. The fold isn't fixed—a laptop, phone, and tablet all have different fold positions for the same page. Design for common viewport sizes while ensuring content below the fold is still discoverable and engaging.

The positioning of elements relative to each other or a container to create visual order and clarity. Strong alignment improves scanability and perceived quality. In Framer, layoutauto layout and constraints help maintain consistent alignment across breakpoints.

AGENTS.md is a project instruction file that gives AI coding agents task context, workflow rules, and constraints so agent behavior aligns with team standards.

A System Prompt is a top-level instruction layer that sets goals, boundaries, and response style before user messages are processed.

Guardrails are technical and procedural constraints, such as filters and validators, that enforce safe and reliable AI behavior.

Related AI terms: Model Card and Content Credentials.

Prompt Enhancement is an AI-assisted rewrite step that expands or clarifies user intent before generation. It often works with a Prompt Template and explicit System Prompt constraints.

The skill of writing, structuring, and iterating on instructions—often called prompts—so that an AI model produces the desired output. In coding contexts, good prompt engineering includes providing context, specifying constraints, and showing examples. In vibe coding workflows, clear prompts directly determine code quality. Effective prompt engineering reduces hallucinations, improves specificity, and is essential for getting reliable results from both code generation and agentic tasks.

An agent handoff is the transfer of context, files, or tasks from one AI agent to another so work can continue without losing project intent.

An agent handoff keeps a workflow moving when a task needs a different tool, model, or specialist. In Framer, this can mean passing site context from a design-focused agent to a coding or CMS-focused agent while preserving the user’s goals and constraints.

Agent context is the project information, user intent, constraints, and prior conversation an AI agent uses to make accurate changes.

Agent context helps an AI system understand what it is editing and why. Strong context can include the selected page, existing CMS structure, current design patterns, and instructions from the user, which reduces generic or mismatched output.

An agent instruction is a rule or request that guides how an AI agent should plan, edit, format, or avoid certain actions.

Agent instructions shape the behavior of an AI assistant. They can describe tone, linking rules, CMS conventions, design constraints, or publishing boundaries so repeated work stays consistent across a project.

An agent prompt is a user request written to guide an AI agent toward a specific project outcome, such as a page edit or CMS update.

An effective agent prompt gives the AI enough direction to act without guessing. It usually names the target, the desired outcome, constraints, and any content or style rules that should be preserved.