How oguzdelioglu/thumbnailgenerator works
Thumbnail Studio is a browser-based bilingual YouTube thumbnail prompt generator. Creators choose a reference-photo or random-character mode, configure visual attributes and layout, generate a prompt, then copy it into an AI image tool. The app also offers preset configurations, canvas preview and positioning, font selection, favorites, and local prompt history. The excerpts show the app coordinating rendering and preview, plus concrete state, storage, localization, favorites, and font interactions; generator and history implementation details are not sampled, so their internal wiring is left limited.
Main entry points: app.js App coordinator · canvas.js Canvas preview · fonts.js Font selector · helpers.js Settings and utilities
Components 19
Creator experience
- Studio page
index.html - App coordinator
js/app.js
Prompt composition
- Prompt generator
js/modules/features/generator.js - Prompt datasets
js/data/index.js - Preset configurations
js/modules/core/presets.js - Font selector
js/modules/features/fonts.js
State and persistence
- Application state
js/modules/core/state.js - Favorites
js/modules/features/favorites.js - Prompt history
js/modules/features/history.js - Storage operations
js/modules/core/storage.js
Preview and localization
- UI renderer
js/modules/ui/renderer.js - Canvas preview
js/modules/ui/canvas.js - Settings and utilities
js/modules/utils/helpers.js - Localization
js/i18n/index.js - Locale strings
js/i18n/locales/en.js
Other components
- Creator
- AI image tool
- Browser localStorage
- Google Fonts
Connections 24
- Creator → Studio page: uses
- Studio page → App coordinator: starts
- App coordinator → UI renderer: updates UI
- App coordinator → Canvas preview: draws preview
- App coordinator → Preset configurations: gets layouts
- App coordinator → Prompt generator: calculates stats
- UI renderer → Application state: updates state
- UI renderer → Localization: translates UI
- Localization → Locale strings: reads strings
- Prompt generator → Prompt datasets: uses options
- Canvas preview → Application state: reads layout
- Canvas preview → Prompt datasets: reads content
- Canvas preview → Font selector: gets selected font
- Font selector → Canvas preview: refreshes preview
- Font selector → Google Fonts: loads fonts
- Settings and utilities → Application state: reads settings
- Settings and utilities → Font selector: gets or sets font
- Favorites → Settings and utilities: gets settings
- Favorites → Application state: manages favorites
- Favorites → Storage operations: saves favorites
- Storage operations → Browser localStorage: reads or writes
- Prompt history → Storage operations: persists history
- App coordinator → Settings and utilities: copies prompt
- Creator → AI image tool: pastes prompt