What an MCP Server Is, How It Works, & What You Can Do with It

A beginner's guide to MCP servers (Model Context Protocol), with prompts and examples
October 30, 2026
10 min.
Contents:

MCP Servers Explained in Simple Terms

An MCP server gives AI agents access to tools and information from external services. The agent can then choose and use the available tools to complete tasks.
How is an AI agent different from a regular chatbot?
A chatbot mainly responds with text. An AI agent can take action in connected services: Create content, make changes, and save results. An MCP server provides the tools that make these actions possible.

Imagine you run an online store with 500 products that need price updates. A chatbot can explain how to do it, but an AI agent with the right access can make the changes for you.
For example, you tell an AI agent: "Change the heading in the Hero Section of my website." The MCP server provides tools for finding a specific page, editing text in a block, and publishing changes. The agent discovers these tools and learns how to use them. It then finds the right project, identifies the Hero Section, updates the heading, publishes the changes, and lets you know when the task is complete.

The agent can only perform actions supported by the available tools and its access permissions.
An example of Claude Code working with the Tilda MCP server: The agent completes a sequence of steps using the available tools.
MCP stands for Model Context Protocol. A protocol is a set of common rules that allows two applications to communicate.
MCP is an open standard that allows AI applications to connect to different services through a consistent interface. The official MCP documentation compares it to USB-C: one standard connection instead of a different cable for every device. This means a service doesn't need a separate integration for every AI application. The same MCP server can make its tools available to compatible applications, including Claude, Codex, Cursor, and others that support the protocol.

The origins of Model Context Protocol (MCP)

Every online service has its own API and integration requirements. Before MCP, developers often had to build separate connections for each AI application and service. Think of the USB-C comparison again: Without a common standard, every device would need its own special connector.
Anthropic, the company behind Claude, introduced MCP as an open standard on November 25, 2024. In December 2025, Anthropic donated MCP to the Agentic AI Foundation, an independent organization supporting open agentic AI technologies.

What MCP enables AI agents to do

An MCP server can expose three main types of capabilities, as defined in the MCP specification.

What the server provides

What it means

Example

Resources

AI agents get access to information

Files, calendar entries, spreadsheets, etc.

Tools

AI agents get permission to perform actions

Creating pages, editing text, and publishing content

Prompts

The server provides pre-made prompts for common tasks

You select a "Plan a trip" prompt and enter your destination and travel dates. The agent handles the rest

Best Tasks to Delegate to an AI Agent

AI agents are particularly useful for tasks that:
  1. Come up repeatedly, whether daily, weekly, or monthly
  2. Take a lot of time to complete manually
  3. Can be broken down into a series of clear steps
Here's how that might work for people with different needs.

Who

Time-consuming tasks

What an AI agent can do

Small online clothing store owner

Update prices and inventory every week, run sales, and edit banners and descriptions for hundreds of products

Update prices, inventory, and descriptions in Tilda's Product Catalog, edit banners, and prepare pages for publication

Freelance web designer

Migrate client websites and recreate layouts based on existing designs

Build pages from descriptions or existing websites

College student

Take detailed study notes, write lecture summaries, and keep track of class schedules

Check a connected calendar, create a weekly to-do list, and organize lecture notes in separate pages

Note: It's strongly recommended that you avoid delegating tasks that could cause irreversible damage if something goes wrong, such as making payments or deleting data without a backup.

Repetitive tasks

Example 1. Update buttons across multiple product cards
  • Difficulty: Easy
  • Task: Manually adjusting a button in every card
  • Prompt: "Change the size and color of the CTA buttons"
  • Result: Using the Tilda MCP server, the agent updated the "Buy" buttons across four pricing cards, making them the same height and setting different widths for each screen size
The prompt and the expected result: The AI agent updated prcies as requested.
Example 2. Make an existing desktop layout responsive for mobile devices
  • Difficulty: Intermediate
  • Task: Manually adjusting every block for mobile screens
  • Prompt: "Make these blocks responsive"
  • Result: The agent created responsive layouts for all the specified blocks
Mobile layout before the AI agent's changes (left) and after (right).

One-time tasks

A one-time task might involve building, editing, or migrating something that only needs to be done once but would take a long time manually. In these cases, an agent doesn't replace a recurring task. Instead, it handles a lengthy series of steps.
Example 3. Build eight blocks in one go
  • Difficulty: Intermediate
  • Task: Manually building each section from scratch in Zero Block
  • Prompt: Eight short requests, such as: "Create a Zero Block Hero Section for a coffee shop called Bean & Brew. Include a heading, a short description, and a 'Book a table' button."
  • Result: The agent followed the Zero Block instructions, created eight empty blocks in order, and assigned a subagent to each one. Each subagent then built the content for its block. The time required varied significantly, from 30 seconds to 20 minutes per block
Examples of Zero Blocks created entirely by AI agents, including both design and copy.
Example 4. Migrate an existing website
  • Difficulty: Advanced
  • Task: Recreating pages and rebuilding blocks from scratch
  • Prompt: A link to an accounting firm's website that needed to be migrated
  • Result: The agent recreated all the pages, including the Home Page, case studies, and blog
Note: To avoid copyright infringement, only recreate websites you own or have permission from the copyright holder to reproduce.

What the Tilda MCP Server Can Do

The Tilda MCP server gives AI agents access to tools that let them perform actions normally carried out through the Tilda interface. An AI agent can create pages, edit blocks, change website settings, prepare content for publication, etc.
It can perform most of the tasks you'd normally handle in the Tilda editor, such as building pages from blocks and editing their content and settings.

The Tilda MCP server supports more than 150 actions, including:
  • Creating pages and organizing them into folders
  • Building pages from blocks and editing text, images, and styles
  • Previewing and publishing pages
  • Connecting fonts and uploading images
  • Managing website settings and SEO
  • Creating and publishing blog posts in Feeds
  • Managing products, prices, and inventory in the Product Catalog
  • Checking connected analytics tools and integrations
The last capability is read-only. The agent can inspect connected analytics tools and integrations for forms, payments, and delivery, but it cannot configure those integrations.
Note: Tilda MCP server is currently in beta, with more features coming soon.

How to Set Up the Tilda MCP Server

To connect an AI agent to Tilda, you'll need a Tilda Personal or Business plan, an MCP-compatible AI agent installed on your device, and an access key from your Tilda account. Find the step-by-step setup guide in the Tilda Help Center.
An access key works like a pass for your AI agent. You create it in your Tilda account under "MCP Server" and control what the agent can access and change. You can grant full or limited access. With limited access, you choose which projects, built-in services, and actions the agent can access.
Keys can be valid for as little as one hour or have no expiration date. Each key is shown only once. If you lose it, you'll need to create a new one. You can revoke a key at any time.
The AI agent must run as an application on your device. Browser-based versions cannot connect to the Tilda MCP server using the setup described here. You can use Claude, Codex, Copilot, Cursor, or another compatible agent.
If you're new to no-code solutions, use this exclusive promo code to get one month of the Tilda Personal Plan instead of the standard 2-week trial.
See instructions on how to activate it

How to Write Effective Prompts for AI Agents

Describe the task as if you were briefing a new assistant: what to change, where to make changes, and which rules to follow. The agent knows which tools are available in Tilda, but it doesn't know what result you expect.
Keep these tips in mind when writing prompts:
1
Specify where to make changes. Specify the exact project, page, or block you want the agent to work on. Page and block numbers are more reliable than vague descriptions and help the agent save time and reduce unnecessary token usage.
2
Describe the end result you want in detail. The agent follows your instructions, so if you don't specify fonts, colors, or images, it may leave them unchanged or make its own choices.
3
Specify your preferred design style and layout method. Explain whether the agent should use pre-designed blocks or Zero Block, and whether to use Auto Layout. Otherwise, the agent will make these decisions on its own.
4
Start small. Begin with a single block or page. Once you're happy with the result, move on to the rest.
If you're not sure where to start, use the prompt builder below. Select a task, specify where to make changes, and describe the result you want.
AI Agent Prompt Builder
What would you like the agent to do?
Provide the details
Your prompt

The prompt builder generates a prompt based on your selected options. It only creates text and doesn't send anything to your AI agent. Copy the generated prompt and paste it into your agent's chat. For more complex tasks, you can edit the prompt to fit your needs.

How AI Agents Build Pages: Fonts, Responsive Design, & Auto Layout

Can an AI agent work with typography?

Yes. The agent can identify available fonts and connect them through project settings or custom code. During testing, the agent sometimes identified layout issues on its own. For example, it reported that an element extended beyond its container because of a font setting, then adjusted the layout to fix it.

Can an AI agent create responsive layouts?

When building a block, the agent can create responsive layouts for desktop and mobile devices by adjusting element dimensions for different screen widths.

For example, here's how it adjusted the width of the "Add to cart" button in product cards:

Screen width (px)

Button width (px)

1200

188

960

142

640

560

480

400

360

280

Can an AI agent build elements using Auto Layout?

With Auto Layout, elements automatically adjust their size and position when content changes.
For example, if you add more text to a button with Auto Layout enabled, the button expands automatically, and surrounding elements adjust to accommodate it. Absolute positioning works differently. Each element stays at a specified position within the block.


Auto Layout

Absolute positioning

How other elements behave

Adjust their position based on surrounding elements

Stay in their specified positions

Best for

Cards, buttons, and other elements containing text of varying lengths

cons in card corners or freely arranged images

The agent can work with both layout methods. You can ask it to use Auto Layout for the main structure and absolute positioning for elements that are unlikely to change.
If you don't specify a layout method, the agent may choose one on its own. That's why it's best to include this detail in your prompt.
Left: A layout method chosen by the AI agent. Right: The result of a more specific prompt asking for absolutely positioned images arranged freely while remaining visually aligned with their corresponding rows.

How to Review an AIAagent's work & Keep Your Projects Secure

To help you work safely with AI agents, the Tilda MCP server lets you limit access permissions, review changes before publishing, and undo edits if something goes wrong. However, you should always review the results yourself. AI agents can make mistakes, so the Tilda MCP server provides tools to help you check and correct their work.
1
Preview. The agent can preview a generated page or individual block to check the result. It can also open the page in a browser and check element positions at different screen widths.
2
Undo and redo. The agent can undo the latest change and redo it if needed.
3
Draft changes. Changes remain in draft until the page is published. The agent only publishes the page when you explicitly ask it to.
4
Recoverable deletion. On Tilda, deleted pages, folders, and products are moved to the Trash, where they are stored for 30 days. You can restore them if something goes wrong.

What should you check manually?

AI agents can identify issues that require additional review. Here are a few examples from our testing.

What the agent reported

What you should do

The hover effect was checked in the code but not tested with a mouse

Наведите курсор на кнопки сами

A screenshot was cropped at one screen width, so only measurements were available

Check the page at all specified screen widths

The layer order was incorrect during one save but was fixed on the next attempt

Review the entire block

Unused images remain in the project

Review the uploaded images and remove any unnecessary files

The agent can view form, payment, and delivery integrations but cannot configure them

Set up these integrations in Site Settings

Example of a report generated by Claude Code after building a page.
Note: AI agents can make mistakes, provide inaccurate information, or lose track of previous instructions. Always review important changes before publishing.

What to do if something goes wrong

1
Tell the agent what went wrong and specify the affected page and block.
2
Ask the agent to undo the latest change.
3
To stop the agent from accessing your project, revoke its access key in your Tilda account. Without a valid key, the agent can no longer make changes through that connection.
4
If the agent cannot connect to Tilda, check that you've entered the correct domain and restart the application.
If the same issue keeps occurring, ask the agent to review your conversation, identify what went wrong, and create instructions to prevent similar mistakes. You can then ask the agent to save these instructions to its memory, if supported, or store them in a shared project instructions file.

How to keep your Tilda account secure

Grant the agent only the permissions it needs to complete a task. This approach is known as the principle of least privilege. The more access an agent has, the greater the potential risks if its access key is exposed or misused. Never share your access key or make it public. Only connect to MCP servers you trust. According to the MCP security guidelines, an untrusted local MCP server may execute commands with the same permissions as the application running it
MCP Server FAQ
  • Do I need coding skills to use an MCP server?
    No. You can describe tasks in plain language. Follow the setup guide to connect an AI agent to Tilda using the MCP server, then use the prompt builder to create your first prompt.
  • What's the difference between MCP and an API?
    An API allows applications to communicate with external services. Each service typically has its own API and integration requirements. MCP is a standardized way for AI applications to discover and use tools and other capabilities provided by connected services.
  • What's the difference between an MCP client and an MCP server?
    An MCP client is a component of an AI application that connects to an MCP server. An MCP server provides access to tools, resources, and other capabilities of an external service. For example, an AI application can connect to the Tilda MCP server to access supported Tilda features.
  • Which AI applications support MCP?
    MCP is supported by AI applications and development tools such as Claude, ChatGPT, Visual Studio Code, and Cursor. Anthropic has also reported MCP adoption across the Gemini and Microsoft Copilot ecosystems.
  • What other services offer MCP servers?
    MCP servers are available for services such as Google Calendar, Notion, Blender, Google Drive, Slack, GitHub, and PostgreSQL. According to Anthropic, the MCP ecosystem had more than 10000 publicly available servers by December 2025.
  • How is MCP different from instructions for an AI agent?
    MCP gives an AI agent access to tools and capabilities provided by connected services, while instructions explain how and when to use them. With an MCP connection, the agent can discover available tools without requiring you to explain how to use each one.
  • Can an AI agent delete content?
    Yes, if its access permissions allow it. For example, if an access key grants access only to the Product Catalog, the agent cannot access unrelated pages through that key. On Tilda, deleted pages, folders, and products are moved to the Trash, where they are stored for 30 days. You can restore them if something goes wrong.
  • How much does it cost to use the Tilda MCP server?
    The Tilda MCP server is available on the Personal and Business plans. AI agent pricing depends on the application you use. Check the provider's official website for current plans and usage limits.

Вернуться к оглавлению

Вернуться к началу

If you liked the article, share it with your friends. Thank you!

Read also:
Free coursebook on how to design, set up, and run
high-conversion landing pages
Learn more

Free practical guide to web animation with examples, techniques,

and tips on how to use them

Explore
Made on
Tilda