Panduan merek · sistem desain

Kertas, tinta, dan satu titik temu.

Halaman mendeklarasikan tool-nya; browser berada di antaranya; halaman dan agent bertemu tanpa saling menggantikan. Logo ini menggambarkan pertemuan itu. Semua yang ada di bawah dirender dari kode yang benar-benar dirilis.

01 · Nama

webmcpx, selalu huruf kecil

Selalu huruf kecil: webmcpx, juga di awal kalimat (lebih baik susun ulang kalimatnya).
Di kode dan perintah, tulis dengan Geist Mono.
WebMCP adalah API browser, ditulis sesuai ejaan di draf. webmcp.zone adalah situs komunitas.
webmcpx bukan WebMCP itu sendiri dan tidak pernah mengklaim nama WebMCP.

02 · Logo

Tiga logo, satu gagasan

Gunakan Junction di mana pun memungkinkan. Kartu adalah badge dan ikon aplikasi (32px ke atas); Halaman dengan slot adalah alternatifnya.

Junction

Logo utama

Logo. Satu warna (currentColor). Dokumentasi, README, slide. SVG
Negatif. Kertas di atas persegi tinta. SVG
Favicon. 16–32px. Mengikuti mode terang dan gelap. SVG
Ikon app. Berwarna, untuk ekspor 512px. SVG
Avatar. Padding 20%: aman untuk crop lingkaran. SVG

Kartu

Badge dan ikon aplikasi, 32px ke atas

Logo. Satu warna (currentColor). Dokumentasi, README, slide. SVG
Negatif. Kertas di atas persegi tinta. SVG
Favicon. 16–32px. Mengikuti mode terang dan gelap. SVG
Ikon app. Berwarna, untuk ekspor 512px. SVG
Avatar. Padding 20%: aman untuk crop lingkaran. SVG

Halaman dengan slot

Alternatif

Logo. Satu warna (currentColor). Dokumentasi, README, slide. SVG
Negatif. Kertas di atas persegi tinta. SVG
Favicon. 16–32px. Mengikuti mode terang dan gelap. SVG
Ikon app. Berwarna, untuk ekspor 512px. SVG
Avatar. Padding 20%: aman untuk crop lingkaran. SVG

03 · Konstruksi

Grid 24 unit, celah 2 unit

Dua chevron padat yang saling mencerminkan. Lengan 4,5 unit di ujungnya, puncak dipotong rata sepanjang 2 unit, dan celah 2 unit di antaranya yang tidak pernah tertutup: celah itulah browser.

Ruang kosong

Sisakan ruang kosong di sekitar logo setara setengah tingginya, dan di sekitar lockup setara tinggi huruf x.

Ukuran minimum

Logo sekecil 16px hanya untuk varian favicon. Lockup minimal setinggi 24px.

04 · Warna

Kertas dan tinta, satu stabilo

Nilai dibaca dari tokens.css. Pilih artwork sesuai latar tempatnya diletakkan, bukan sesuai tema pembaca.

paper

#f2f1ed

Latar halaman
paper-2

#e8e6e0

Panel cekung, track
card

#fcfbf8

Kartu dan input di atas kertas
ink

#121210

Teks, outline, bayangan, tombol utama
ink-2

#43423f

Teks sekunder
ink-3

#5c5b56

Keterangan dan label
hairline

#d3d1ca

Pemisah tipis
marker

#fcd948

Stabilo: satu-satunya aksen
good

#197037

Siap, lulus (teks)
good-soft

#b9eec2

Siap, lulus (isian)
bad

#af2b25

Tidak ada, gagal (teks)
bad-soft

#ffd9d2

Tidak ada, gagal (isian)
code

#171614

Latar blok kode
on-code

#e9e8e3

Teks di blok kode

Pasangan teks yang disetujui

WCAG 2.2 AA mensyaratkan 4,5:1 untuk teks isi; sebuah tes memastikannya.

Teks di atas latar	Kontras
ink di atas paper	16.65:1
ink di atas paper-2	15.08:1
ink di atas card	18.17:1
ink di atas marker	13.55:1
ink di atas good-soft	14.35:1
ink di atas bad-soft	14.41:1
paper di atas ink	16.65:1
ink-2 di atas paper	8.86:1
ink-2 di atas card	9.67:1
ink-3 di atas paper	6.04:1
ink-3 di atas paper-2	5.47:1
ink-3 di atas card	6.59:1
good di atas paper	5.47:1
good di atas card	5.97:1
bad di atas paper	5.79:1
bad di atas card	6.32:1
on-code di atas code	14.73:1

Kuning untuk latar, bukan untuk bentuk

Kuning stabilo di atas kertas hanya 1.23:1: tidak sanggup membawa bentuk atau teks. Gunakan di belakang tinta: kata yang distabilo, chip, ikon aplikasi.

05 · Tipografi

Bricolage, Geist, Geist Mono

Bricolage Grotesque · raksasa

Siap agent

Bricolage Grotesque · judul

Agent sama. Pertanyaan sama.

Geist · teks isi

Kalimat pendek yang bisa dicek. Satu gagasan per kalimat.

Geist Mono · kode dan label

document.modelContext.registerTool()

06 · Komponen

Outline 2px, bayangan tegas

src/lib/components/ui. Varian adalah resep tailwind-variants; bentuknya berasal dari token yang sama.

Button · varian × ukuran

Stamp · nada

plainmarkergoodbadink

Card

Card interaktif (hover)

Keadaan kosong

Tabs

Panel untuk Pertama. Gunakan tombol panah.

Panel untuk Kedua. Gunakan tombol panah.

CodeBlock (di-highlight saat build)

index.html

<script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/src/auto.js"></script>

07 · Salah pakai

Jangan

Jangan meregangkan atau memampatkannya
Jangan memutarnya
Jangan menambahkan outline atau garis tepi
Jangan menggambarnya dengan warna kuning
Jangan menambahkan bayangan atau efek pada logo
Jangan menutup celah di antara chevron

08 · Merek dagang

Pakai namanya dengan bebas. Jangan terkesan resmi.

Kodenya berlisensi MIT; nama dan logonya tidak termasuk dalam lisensi itu. Kebijakan lengkapnya ada di TRADEMARK.md.

Tulis seperti ini

Mengimplementasikan WebMCP Draft Community Group Report dari W3C Web Machine Learning Community Group (bukan standar W3C).
Dibuat dengan webmcpx. Kompatibel dengan webmcpx.
Berjalan di Chrome dengan flag WebMCP diaktifkan.

Jangan pernah

Library WebMCP resmi
Standar W3C WebMCP
Bersertifikat MCP
webmcpx untuk Chrome

Gaya bahasa

Kalimat pendek yang bisa dicek. Angka, bukan kata sifat.

Kata yang kami pakai

mendeklarasikanmengeksposmemanggilterukurmengikuti draf Community Groupbekerja dengan webmcpx

Kata yang kami hindari

resmistandar W3Csesuai standar W3Cbersertifikat MCPrevolusionerajaib

Pemberitahuan

webmcpx adalah proyek independen, tidak berafiliasi dengan maupun didukung oleh LF Projects, Agentic AI Foundation, Anthropic, W3C, Google, atau Microsoft.
Model Context Protocol dan logo MCP adalah merek dagang LF Projects, LLC.
W3C® adalah merek dagang World Wide Web Consortium.

Baca TRADEMARK.md