Loading the profile
Loading the profile
We use cookies you can say no to for analytics, ad measurement, and embedded videos. Signing in works either way. You can change this any time from Cookie settings at the bottom of every page. What we use
Creator's example Pricing page for a notes app
You ask: Make a pricing page for a note-taking app with three plans, in this look. Plans: Free, Plus $4 a month, Team $8 per person a month.
3 steps, in order. Sign in to keep track as you go.
Connect Claude Code to Figma's remote MCP server and sign in with Figma.
Passes on: Claude can read your Figma file
Install a design system, or use your own, so the look lives in design/ in your project.
Passes on: DESIGN.md and tokens in design/calm-product-look/
Makes
Creator's example Pricing page for a notes app
Pull Figma's variables into the tokens, or push the tokens to Figma, approving every change.
Passes on: Figma and the app use the same colors, fonts, and sizes
