Brand Kit

The logo

A lockup for most places and a mark for small ones, in black and in white.

The idea

The mark is a rounded square with a symbol cut out of it: the full stop from mcp.tc, launched forward. In Geist, the typeface of the wordmark, a full stop is a square. Three speed trails behind it stand for a request that leaves your client and reaches the server right away.

Apart from the rounded corners, every edge is horizontal or vertical and sits on a 32-unit grid. That keeps the mark sharp down to 16 px, where each unit is half a pixel and the trails are 1, 2 and 1 px tall.

Measured in units of a 32-unit grid. Rounded square 32 × 32, corner radius 8. Full stop 12 × 12. The trails and the gaps between them add up to its height: 2 + 2 + 4 + 2 + 2.

The lockup

The wordmark is “mcp.tc” in Geist SemiBold, turned into outlines. Its lowercase letters are exactly as tall as the full stop in the mark, and both sit on the same baseline, so the mark reads as part of the name.

Use the files as they are. A lockup rebuilt from the font loses the tighter letter spacing (−0.02 em) and the exact gap to the mark.

The full stop is 12 units, the wordmark’s x-height is 12 units, and both rest on the baseline.

Files

SVG for anything that scales, transparent PNG for everything else. PNGs are trimmed to the artwork, so add the clear space yourself.

All files (ZIP, 134 KB)

Lockup

The mark and the wordmark side by side. Use this one first.

Black
Lockup, Black, SVG Lockup, Black, PNG 230×64 Lockup, Black, PNG 460×128 Lockup, Black, PNG 920×256

White
Lockup, White, SVG Lockup, White, PNG 230×64 Lockup, White, PNG 460×128 Lockup, White, PNG 920×256

Any color
Lockup, any color, SVGOn a web page it takes the text color (currentColor); elsewhere it shows black.
Stacked lockup

The mark above the wordmark, for square and narrow spaces.

Black
Stacked lockup, Black, SVG Stacked lockup, Black, PNG 140×120 Stacked lockup, Black, PNG 280×240 Stacked lockup, Black, PNG 560×480

White
Stacked lockup, White, SVG Stacked lockup, White, PNG 140×120 Stacked lockup, White, PNG 280×240 Stacked lockup, White, PNG 560×480
Mark

The rounded square alone, with the symbol cut out so the background shows through. For small spaces on a plain background.

Black
Mark, Black, SVG Mark, Black, PNG 64 Mark, Black, PNG 128 Mark, Black, PNG 256 Mark, Black, PNG 512 Mark, Black, PNG 1024

White
Mark, White, SVG Mark, White, PNG 64 Mark, White, PNG 128 Mark, White, PNG 256 Mark, White, PNG 512 Mark, White, PNG 1024

Any color
Mark, any color, SVGOn a web page it takes the text color (currentColor); elsewhere it shows black.
Tile

The mark with its symbol filled in: white on the black tile, black on the white one. For favicons, photos and busy backgrounds.

Black
Tile, Black, SVG Tile, Black, PNG 512 Tile, Black, PNG 1024

White
Tile, White, SVG Tile, White, PNG 512 Tile, White, PNG 1024
Avatar

A full square with the symbol alone, for profile pictures and app icons that get cropped to a circle or a rounded square.

Black
Avatar, Black, SVG Avatar, Black, PNG 512 Avatar, Black, PNG 1024

White
Avatar, White, SVG Avatar, White, PNG 512 Avatar, White, PNG 1024

Using the logo

Give it room, keep it big enough to read, and put it where it has contrast.

Clear space

Keep at least X free on every side. X is the side of the full stop in the mark: 3/8 of the mark’s height. A lockup 32 px tall needs 12 px; one 64 px tall needs 24 px.

Text, other logos and the edge of the page stay outside that margin.

Minimum size

Mark: 16 px tall on screen, 5 mm in print
Lockup: 72 px wide (20 px tall) on screen, 20 mm wide in print
Below that: Use the mark alone

On screen the mark is sharpest at multiples of 16 px: 16, 32, 48, 64. Every edge then lands on a whole pixel.

16 px 72 × 20 px

16 32 48 64

Actual size on your screen: the smallest mark and lockup, then the mark at 16, 32, 48 and 64 px.

Backgrounds

Black on white and light backgrounds.

White on black and dark backgrounds.

The tile on photos and busy backgrounds.

In use

Header: the lockup on the left, 32 px tall, with X clear on every side.

mcp.tc
MCP servers, properly addressed.

Profile picture: the avatar file, cropped to a circle.

mcp.tc/i/notion

Next to a link: the mark at text height, then the link in Geist Mono.

Don’ts

People recognize a logo that looks the same everywhere, so please use it as it is.

Don’t recolor it. Use black, white or the tile.
Don’t stretch or squash it.
Don’t rotate it.
Don’t add outlines, shadows or gradients.
Don’t move, resize or re-space the trails.
Don’t place it where it lacks contrast.
Don’t set the wordmark in another font.
Don’t add words to the lockup.

Colors

Black, white and a ramp of grays. Color is kept for four states that say what a server needs; the only other color on mcp.tc comes from the servers’ own icons.

Ink

The logo, plus text and primary buttons in the light theme. Also the dark theme’s background.

#0A0A0ARGB 10 10 10

Paper

Backgrounds, and the logo files for dark backgrounds. Ink on Paper has a contrast of 19,8:1. On mcp.tc’s own dark theme the logo takes the text color, #EDEDED.

#FFFFFFRGB 255 255 255

Interface

Color	Used for	Light theme	Dark theme
Background `--bg`	Page background	`#FFFFFF`RGB 255 255 255	`#0A0A0A`RGB 10 10 10
Surface `--bg-2`	Link fields, code, the footer	`#FAFAFA`RGB 250 250 250	`#111111`RGB 17 17 17
Hover `--bg-3`	Hover fills, selected items	`#F2F2F2`RGB 242 242 242	`#1A1A1A`RGB 26 26 26
Hairline `--line`	Card and panel borders, dividers	`#EBEBEB`RGB 235 235 235	`#232323`RGB 35 35 35
Border `--line-2`	Buttons and chips	`#D9D9D9`RGB 217 217 217	`#333333`RGB 51 51 51
Input border `--line-input`	Text field borders (need 3:1)	`#8F8F8F`RGB 143 143 1433,23:1	`#616161`RGB 97 97 973,20:1
Tertiary text `--fg-3`	Hints, dates, the mcp.tc/i/ prefix	`#6B6B6B`RGB 107 107 1075,33:1	`#8C8C8C`RGB 140 140 1405,89:1
Secondary text `--fg-2`	Descriptions and notes	`#4D4D4D`RGB 77 77 778,45:1	`#A3A3A3`RGB 163 163 1637,85:1
Text `--fg`	Text, primary buttons, focus rings and the site’s own logo	`#0A0A0A`RGB 10 10 1019,80:1	`#EDEDED`RGB 237 237 23716,91:1
Button hover `--btn-hover`	Primary button on hover	`#2E2E2E`RGB 46 46 46	`#CFCFCF`RGB 207 207 207

States

State	What it means	Light theme	Dark theme
No sign-in Green `--ok` `--ok-text`	The server needs no account or key.	`#16A34A`DotRGB 22 163 743,30:1`#15803D`TextRGB 21 128 615,02:1	`#22C55E`DotRGB 34 197 948,69:1`#4ADE80`TextRGB 74 222 12811,36:1
Sign-in Amber `--warn` `--warn-text`	Filled: the server asks for a sign-in or an API key. Ring: sign-in is optional.	`#D97706`DotRGB 217 119 63,19:1`#B45309`TextRGB 180 83 95,02:1	`#F59E0B`DotRGB 245 158 119,22:1`#FBBF24`TextRGB 251 191 3611,86:1
Local Gray `--local`	Filled: the server runs on your own machine. Ring: a remote server whose sign-in we couldn’t confirm.	`#8F8F8F`DotRGB 143 143 1433,23:1	`#737373`DotRGB 115 115 1154,18:1
Last check failed Red `--err` `--err-text`	The last check failed, or the listing was removed.	`#DC2626`DotRGB 220 38 384,83:1`#B91C1C`TextRGB 185 28 286,47:1	`#EF4444`DotRGB 239 68 685,26:1`#F87171`TextRGB 248 113 1137,16:1

Contrast is measured against the page background. Text colors reach at least 4.5:1 and the dots at least 3:1, and every dot comes with a label, so color is never the only signal.

Typography

Geist for what you read, Geist Mono for what you copy.

Geist

Add it to your client. Notion asks you to sign in the first time.

Regular 400Medium 500SemiBold 600

Headings, text, buttons and labels. The wordmark is Geist SemiBold.

Geist Mono

mcp.tc/i/notion

Regular 400Medium 500SemiBold 600

Links, commands, code, tool and package names. In a link the prefix is gray and the name is SemiBold.

Page heroGeist 600 · 34–52 px · −0.04 em
Page titleGeist 600 · 28–36 px · −0.035 em
Section titleGeist 600 · 24 px · −0.025 em
SubheadGeist 600 · 16 px · −0.01 em
Body text, 1.5 line heightGeist 400 · 16 px
Buttons, navigation, labelsGeist 500 · 14 px
Notes and captionsGeist 400 · 13 px
https://mcp.tc/i/deepwikiGeist Mono 400 / 600 · 17 px
claude mcp add --transport http deepwiki https://mcp.deepwiki.com/mcpGeist Mono 400 · 13 px

Geist and Geist Mono are by Vercel, with basement.studio, and free under the SIL Open Font License 1.1. Get them from github.com/vercel/geist-font or Google Fonts. The logo files don’t need the fonts: the wordmark is already converted to outlines.

Name and wording

How to write about mcp.tc so it matches what the site says.

The name

mcp.tc in lower case, with the dot, even at the start of a sentence.
A listing’s link: mcp.tc/i/notion. Add https:// when people will copy it.
Not MCP.TC, Mcp.tc, MCP.tc, MCP TC, mcp .tc or mcptc.

The words

Call it a link: “copy the link”, “share the link”.
Say quick link only to tell it apart from a server’s own URL.
The link opens the server’s page. Clients connect to the server’s own URL.
Don’t give it another name, and don’t call mcp.tc a proxy or say it redirects.

Descriptions to reuse

One line
mcp.tc: MCP servers, properly addressed.
Short
mcp.tc is a directory of MCP servers. Every server gets a link, like mcp.tc/i/deepwiki, to a page with its tools and one-click setup for Claude, Cursor or VS Code that connects straight to the server.
Long
mcp.tc is a free directory of Model Context Protocol (MCP) servers. Every listing gets its own link, such as mcp.tc/i/notion, which opens a page with the server’s tools and setup steps for Claude, Cursor, VS Code and other clients. The setup connects your client straight to the server’s own URL or package, and sign-ins and API keys never pass through mcp.tc. mcp.tc isn’t affiliated with the servers it lists.

Contact

For press or brand questions, or a format that isn’t here, write to privacy@mcp.tc. You’re welcome to use these files to link to mcp.tc, to write about it or to show that your server is listed. Please don’t use them in a way that suggests mcp.tc endorses or runs your product.

mcp.tc isn’t affiliated with the vendors it lists. Their names and logos belong to them; this kit covers only mcp.tc’s own marks.