Compose a landing page from layouts observed on real pages, then review the built page for drift.
Setup
Choose your client, copy the config, then fill in any required environment variables.
claude mcp add --transport http layoutline https://app.layoutline.dev/api/mcp~/.codex/config.toml
[mcp_servers.layoutline]
url = "https://app.layoutline.dev/api/mcp"
# codex mcp add layoutline --url https://app.layoutline.dev/api/mcp~/.cursor/mcp.json
{
"mcpServers": {
"layoutline": {
"url": "https://app.layoutline.dev/api/mcp"
}
}
}.vscode/mcp.json
{
"servers": {
"layoutline": {
"type": "http",
"url": "https://app.layoutline.dev/api/mcp"
}
}
}~/.gemini/settings.json
{
"mcpServers": {
"layoutline": {
"httpUrl": "https://app.layoutline.dev/api/mcp"
}
}
}claude_desktop_config.json · Customize › Connectors › Add custom connector
{
"mcpServers": {
"layoutline": {
"command": "npx",
"args": [
"-y",
"mcp-remote",
"https://app.layoutline.dev/api/mcp"
]
}
}
}.trae/mcp.json
{
"mcpServers": {
"layoutline": {
"url": "https://app.layoutline.dev/api/mcp"
}
}
}