Hi everyone, I just open sourced OpenBrand - extract any brand's logos, colors, and assets from just a URL.
— Ethan Jiang (@ethanjyx) March 13, 2026
It's MIT licensed, open source, completely free.
Try it out at https://t.co/KiA9NnZDl5
Why we built this: while building another product, we needed to pull in customers'… pic.twitter.com/bgmcEMl1U8
AI 中文摘要Claude 生成
Ethan Jyx 開源釋出了「OpenBrand」工具,可以從任意網址提取品牌資產,包括標誌、配色和其他品牌元素。該專案採用 MIT 授權,完全免費開放使用。
開發者在建立另一款產品時產生了這個需求——他們需要從客戶的網站自動提取品牌資訊。這個實際應用場景直接驅動了 OpenBrand 的誕生,反映出許多開發者在整合客戶品牌資料時面臨的共同痛點。
OpenBrand 提供三種使用方式滿足不同場景。首先是 API 服務,使用者可以從 openbrand.sh/dashboard 申請免費 API 金鑰,然後透過 HTTP 端點呼叫。該服務支援 cURL、TypeScript 和 Python 等多種語言的客戶端範例,降低了集成難度。其次是 npm 套件,開發者可以直接安裝使用,無需申請 API 金鑰,作為伺服器端程式庫執行。第三種是「MCP 伺服器」(Model Context Protocol),允許在 Claude Code、Cursor 等 MCP 相容客戶端中使用 OpenBrand。使用者可以簡單地告訴 Claude「從 stripe.com 提取品牌資產」,AI 會自動呼叫相應工具。
該工具的提取能力相當全面。在標誌方面,它會搜集 favicon、apple-touch-icon、頁面導航中的標誌和內聯 SVG,並通過維度探測進行處理。配色則來自 theme-color meta 標籤、manifest.json 檔案以及從標誌影像提取的主色。它還會抓取 og:image、CSS 背景和英雄區塊等背景圖片,品牌名稱則從 og:site_name、application-name、標誌替代文字和頁面標題中推導。
技術棧採用 Next.js、React、TypeScript、Cheerio(用於 HTML 解析)、Sharp(用於影像處理)和 Tailwind CSS。這個選擇反映出開發者優先考慮的是速度、易用性和現代開發體驗。
使用者可以在 openbrand.sh 體驗線上版本,也可以透過 git clone 專案程式庫並執行 bun install 和 bun dev 來本地自託管。本地部署無需環境變數配置,開啟 http://localhost:3000 即可使用。
這個專案的開源釋出代表了一種務實的開發思維——先因為實際需求而構建工具,確認其價值後再以開源形式貢獻給社群。相比那些抽象的通用工具,OpenBrand 有著明確的應用場景和經過驗證的實用性。作為一個採用 MIT 授權的開源專案,它完全免費,旨在為廣大開發者提供一個高效且可自訂的品牌資產提取解決方案。
