Back to Template Guides
Create a new section or page with Skills
Jennifer L.
Founder & Designer at Lunis
What is the /design-system skill
Skills are saved instructions the Framer AI agent follows whenever you invoke them. The /design-system skill tells the agent to build new sections and pages using your template's own design, so everything it creates fits right in.
What it does:
Reuses your template's components, colors, text styles, spacing, and layouts.
Keeps new sections and pages consistent with the rest of your site.
⚠️ Note: This is a new Framer feature, so not every template includes the /design-system skill yet. We're actively adding it across our templates.
How to use it
Open the agent chat in your project.
Type
/design-system, then describe what you want to build.
Example: Build a new section
When you need a section the template doesn't include, such as an FAQ or a testimonials block. Select the section it should sit next to first.
Use /design-system to add a testimonials section to the @home page, placed below the features section. Include three testimonials, each with a name, role, and quote.
Example: Build a new page
When you need a whole new page built on your template's design.
Use /design-system to create a new Careers page. Add a hero section snd intro about the company culture, and a button labeled "See open roles".
Once you are happy with it, add the next section:
Use /design-system to add an open roles section on the @career page. List three roles, each showing the job title, location, and employment type, with a "Read more" link.
Tips for best results
Focus on one section at a time. The agent does its cleanest work on a single, well-defined task.
Be as clear as possible. The more detail you give about the content and its purpose, the closer the first pass will be.
Review every breakpoint before publishing. The agent designs for desktop first, so check your tablet and phone layouts and fix anything that overflows or looks cramped before you publish.
Use a branch for large changes. For a whole new page or a big restructure, work in a branch so you can review everything and merge only when you are happy.
