model-tea

KO | EN

gitlite — search

#python #hacktoberfest #ai #machine-learning #rust #linux #docker #macos #nodejs #java #cli #kubernetes #security #openai

(★ 16)

ModelTea — a HeyTea-style mobile UI prototype for ordering LLMs like bubble tea

model-tea 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# ModelTea 模室

A mobile-first UI prototype that reimagines **ordering an LLM** as **ordering bubble tea** — styled after the HeyTea (喜茶) mini-program, in a clean black-and-white aesthetic.

Instead of picking a drink, you pick a model; instead of sweetness and toppings, you configure context window and capabilities; instead of a price tag, you see real per-million-token pricing.

## Highlights

- **Single self-contained file** — everything lives in `index.html` (HTML + CSS + vanilla JS). No build step, no dependencies. Just open it in a browser.
- **HeyTea-style flow** — menu (category sidebar + model list) → product detail (spec customization) → order checkout → receipt.
- **Real models & pricing** — Claude (Opus 4.8 / Sonnet 4.6 / Haiku 4.5 / Fable 5), GPT-5.5, GPT-5 mini, Gemini 3 Pro, Qwen3 Max, DeepSeek V3, Llama 4 Maverick, with official-style descriptions and public USD pricing per 1M tokens (input / output).
- **Bubble-tea → model mapping**
  | Bubble tea | Model |
  |---|---|
  | Cup size | Context window (256K / 1M) |
  | Toppings | Capabilities (web search / vision / deep thinking) |
  | Add-on | Attachment (image / document) |
  | Price tag | Per-million-token cost |
- **Official brand logos** — monochrome SVG marks for each vendor (Anthropic / OpenAI / Google / Qwen / DeepSeek / Meta).
- **Pixel-art mascot** — the order receipt is stamped with Clawd, the pixel crab.

## Usage

```bash
open index.html        # macOS
# or just double-click index.html
```

The page is fixed to a 3:4 aspect-ratio card and adapts to full-screen on narrow viewports.

## Files

```
index.html    # the whole app
clawd.png     # pixel-art mascot used on the receipt
logos/        # vendor brand SVGs (source copies; logos are also inlined in index.html)
```

## Notes

This is a **demo / concept piece** — it does not call any model API. Prices and model specs are illustrative and reflect public information at the time of writing; verify against each vendor's official pricing page before relying on them.

## License

MIT

model-tea

model-tea 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

model-tea

model-tea 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README