# eric zakariasson 打造 Gloss，讓使用者用 prompt 重新設計任何網站的視覺風格

> 📖 本站完整內容索引（documentation index）：[llms.txt](/llms.txt)

> 原作者：eric zakariasson (@ericzakariasson) · 策展與摘要：EasyVibeCoding · 平台：X (Twitter) · 熱度：🔥🔥 · 日期：2026-08-11

> 原始來源：https://x.com/ericzakariasson/status/2086823288546926958

## 證據與延伸閱讀

- [eric zakariasson 打造 Gloss，讓使用者用 prompt 重新設計任何網站的視覺風格](https://github.com/ericzakariasson/gloss) — 官方 Repository

## 中文摘要

eric zakariasson 打造 Gloss，讓使用者用 prompt 重新設計任何網站的視覺風格。

它可將頁面改成禪、inverse 或 holiday themed 等風格；影片示範中，輸入「make this brutalist」後，社交平台頁面逐步套用粗體線框與 Raw-kraft paper 風格。

<video src="https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1786376425360-8jb6uphy.mp4" poster="https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/ef72fc589b37ce91.jpg" controls playsinline preload="metadata" style="max-width:100%;height:auto;display:block;margin:1rem 0"></video>
> 在 Gloss 浮動側欄輸入指令，將頁面轉為 brutalist 風格

**運作方式** Gloss 是一款以浮動 orb 操作的 Chrome extension，會擷取目前頁面的螢幕畫面與簡化 DOM 資訊，連同 prompt 傳送至 xAI Grok API，再串流注入 CSS，必要時也執行 JavaScript。使用者可以持續 prompt，每次都以新畫面反覆調整；變更會依網站保留，直到按下 Reset。程式碼與設定位於 [Gloss](http://github.com/ericzakariasson/gloss)。

**限制與風險** Gloss 目前不是 Chrome Web Store 擴充功能，必須以 load-unpacked 方式安裝，因為 Chrome 禁止執行模型產生的 JavaScript。每次改造都會把可見分頁的螢幕畫面、URL、標題、頁面地標與可見標籤傳至 `api.x.ai`；API key 儲存在 `chrome.storage.local`，並只會以 Bearer token 傳給 xAI。模型產生的 JavaScript 會在頁面中執行，因此登入中或含敏感資料的網站不宜直接使用，相關行為需人工核對。

**模型設定** 專案預設使用 `grok-4.5`；若 API key 無法使用該版本，來源建議改用 `grok-4.3`。

## 媒體內容

**在 Gloss 浮動側欄輸入指令，將頁面轉為 brutalist 風格**

**影片中的 Prompt 與操作**

Prompt（00:01）：

```
將這個設計改為粗獷主義風格
```

原文：make this brutalist

操作步驟：

1. （00:03）點擊 Gloss 按鈕送出 prompt

## 標籤

新產品, AIGC, Gloss