TeleYou

Material You theme generator for Telegram — runs entirely in your browser.

Extract palettes from images or colors and export native themes for Telegram Desktop and Mobile. No install, no server, no data collection.

---

Features

• Image extraction — upload any photo and TeleYou derives a full Material You palette from its dominant colors
• Seed color — pick or randomize a single HCT color to generate the entire palette
• Fine-grained editing — tweak Primary, Secondary, Tertiary, Error, Neutral and Neutral Variant individually with the built-in HCT picker
• Live preview — side-by-side mobile and desktop Telegram mockups update in real time
• Two export targets — .attheme for Telegram Android/iOS, .tdesktop-theme for Telegram Desktop
• Three color modes — Light, Dark, and AMOLED (true black)
• 100% client-side — all processing happens in your browser via WebAssembly; nothing is sent to any server

Tech stack

Layer	Library
Color science	@material/material-color-utilities
Archive export	jszip
Build	Vite 8
Font	Google Sans Flex + Material Symbols

Getting started

# Clone
git clone https://github.com/snw-mint/teleyou.git
cd teleyou

# Install dependencies
npm install

# Start dev server
npm run dev

# Build for production
npm run build

Requires Node.js ^20.19.0 or >=22.12.0 (Vite 8 requirement).

Project structure

teleyou/
├── public/                  # Static assets (favicons, manifest, theme templates)
│   └── templates/           # Blank .attheme and .tdesktop template files
├── src/
│   ├── assets/              # Wallpapers, avatar images
│   ├── css/                 # Stylesheets (style, mockup, modals, pages)
│   └── js/                  # Application logic
│       ├── main.js          # Entry point — theme extraction & UI wiring
│       ├── hct-picker.js    # HCT color picker component
│       ├── hct-constraints.js # Role-aware color constraints
│       ├── export-modal.js  # Export flow (mode → platform → download)
│       ├── theme-mobile.js  # .attheme generator
│       └── theme-desktop.js # .tdesktop-theme generator
├── app.html                 # Generator page (noindex)
├── index.html               # Landing page
├── privacy.html             # Privacy policy
└── terms.html               # Terms of use

Deploying to GitHub Pages

The project is configured to deploy directly from the docs/ folder on the main branch, meaning it runs as a pure static site with no runtime dependencies or build steps required on GitHub itself.

To compile and update the deployment:

1. Run npm run build locally. This will compile the site and write the static output to the docs/ directory.
2. Commit and push the docs/ directory to GitHub.

To configure GitHub Pages:

1. Go to your repository settings on GitHub.
2. Navigate to Pages in the sidebar.
3. Under Build and deployment -> Source, select Deploy from a branch.
4. Select main as the branch and select /docs in the directory dropdown.
5. Click Save.

Contributing

Bug reports, theme color corrections, and feature ideas are all welcome. Please use the issue templates to keep things organized.

For code contributions, open a pull request against main. Keep changes focused — one fix or feature per PR.

License

MIT © 2026 Snow Mint