The banner creator
The banner creator
The banner creator builds an animated Telegram custom-emoji strip out of text, images and named motion presets. It is a web-dashboard tool; nothing about it runs through the Telegram bot.
Overview
The banner creator is **web-only. ** No slash command and no button in the per-user bot fleet touches it — the only thing that reaches Telegram is the finished emoji pack, delivered by DM after export.
The page sits behind the login gate, and ** ** The free-tool demo route (/api/banner-designer/demo) is wired only to the coin creator. Signed out, /banner-creator redirects to / and opens the login prompt; it renders nothing until you're authenticated.
Entry points
| Where | Path |
|---|---|
| Standalone page | /banner-creator |
| Dashboard | Emoji Design → Banner tab, "Open Banner Designer" button |
| Header nav | Free Tools → Banner Builder |
What a banner is
| Setting | Value |
|---|---|
| Tiles | 8, one row (8 × 1) |
| Tile size | 512 × 512 px each |
| Master canvas | 4096 × 512 px — an 8:1 strip |
| Default loop length | 1.2s (72 frames at 60fps) unless the current design's own bake reports a different length |
Note
The same studio component also renders the coin creator, in a separate
mode="coin". The coin creator is a single-tile, 512×512 product, documented on its own.
"Banner" names two unrelated things elsewhere in the product: the raid bot's animated progress bar (internally called a progress banner, authored separately by admins) and DexScreener / X profile header images pulled by the scanner and X automations. Neither is built by this tool.
The top bar
Five controls, left to right.
| Control | Behaviour |
|---|---|
| Undo / Redo | Steps back and forward through the edit history. |
| Reset all | Confirm popover: “Are you sure? This resets everything to the original state. You can still go back with ‹ afterwards.” Confirming reverts every control to its starting state. |
| Save | Saves the current design to your permanent collection. Name field, up to 48 characters; placeholder falls back to the pack name (Export, below), then the banner text, then “My Emoji Pack”. Hint: “permanent — separate from the auto-restored workspace”. |
| Export | Opens the export panel — see Create → export, below. The button label reads “Exporting…” while a pack job is running. |
| View Saved | Lists your saved designs under the heading “Your saved banners,” each with a live animated thumbnail. Empty state: “nothing saved yet — hit Save on a banner you like.” |
Save writes to your permanent collection. It is separate from the workspace draft, which auto-saves as you work and restores whatever you last had open, saved or not — see Create → export.
The styling row
Five controls, left to right, set the banner's text and its still appearance.
| Control | Accepts | Default |
|---|---|---|
| Banner text | up to 24 characters | “MEMESCALE” — the placeholder “Banner text” shows only once you clear the field |
| Font | a starter font, or one you uploaded (.ttf / .otf); “Font from web” scrapes a font, colour palette and logos from a URL you paste | — |
| Text colour | hex / RGB entry, or a colour lifted from a scanned site's palette | white, #ffffff |
| Container fill | hex / RGB entry — disabled whenever a Design (skin) is active | black, #000000 |
| Add an animation | see below; disabled once 4 motions exist | none |
Container fill, locked by a Design
| Input | Output |
|---|---|
| Active skin | ticket (1 colour slot) |
| Tooltip shown on Container fill | Disable the “ticket” design to enable solid color container. It is currently set by Design 1. |
Text colour sub-rows
The text colour badge also carries five collapsible sub-rows:
| Sub-row | Controls | Default once turned on |
|---|---|---|
| Style | Bold and Italic toggles; Bold reveals a Weight slider, 25%–250% in steps of 5 | Weight 100% while Bold is off |
| Alignment | Left / Center / Right | Center |
| Gradient | two colour stops across the text | #56c4ff → #ba6eff |
| Outline | “white outline around the text” | width 5, white |
| Shadow | “drop shadow behind the text” | dx 10, dy 14, black, 55% opacity |
Add an animation
The dropdown offers four sources, each placing a moving element on the stage — see The motion system, below.
| Source | What it does |
|---|---|
| From Emoji | opens the emoji picker; place any premium emoji as a moving element |
| From Image → From Files | upload .png, .jpg, .jpeg, .webp, .avif or .svg |
| From Image → From Website | pick from images already scraped from a site scanned via Font-from-web |
| From Lottie File | upload a .json Lottie file |
| From Profile Picture | fetch a Telegram user's profile photo by username, with a square/circle crop toggle |
Limit
Up to 4 motions total, from any combination of these sources — the Add an animation control disables itself at the cap.
The knob row
Four sliders, plus a fifth that appears once a Border preset is active.
| Knob | Range | Default |
|---|---|---|
| Letter Spacing | −30 … 100 | 0 |
| Text Size | 40% … 100% | 100% |
| Border Radius | 0 … 250 — disabled when the active Design sets its own shape | 84 |
| Animation Speed | 0.3× … 2.5× | 1.0× |
| Border width (shown only once a Border preset is picked) | 2 … 16 | — |
Border Radius, locked by a Design
| Input | Output |
|---|---|
| Active skin | ticket |
| Tooltip shown on Border Radius | Disable the “ticket” design to enable border radius — it currently sets its own border radius. |
“ticket” is the only Design preset that currently sets its own shape (ownsRadius); the same lock disables the Border knob and border colour.
Below the knobs, two more controls appear conditionally. A Second text field — up to 24 characters, placeholder “Second text (required),” hint “swaps in mid-loop” — appears once a Two-Text preset is active. 1–8 Design colour badges appear once a Design (skin) is active, labelled “Color n” when the skin exposes more than 2 slots and “Design n” otherwise, with a reset button that clears your overrides back to the skin's own palette.
The stage
The stage plays the same animation the pack ships — not a simplified preview.
- A background swatch picker sits over the stage; it shows a checkerboard when Container fill is set to none.
- Placed images and emoji can be dragged to move; a corner handle scales them, a separate handle rotates them, and a × removes them.
- Motion paths draw as an overlay on the stage. Clicking one opens a chip offering edit (✎), tint, and delete.
- A chip strip under the stage lists every active choice — the Animation preset, Entrance, Design, each Effect, Border, and Two-Text — each removable with its own ×. Clicking a chip scrolls the rail to that cell and flashes it.
The meta line reads {tiles} × 512 · {loop}s loop — for a banner, 8 × 512 · 1.2s loop by default.
The rail
Six tabs list the buildable pieces of a banner. Every cell in every tab is a live-rendered preview of what picking it would do to the current design, not a static icon.
The 6 rail tabs, live counts as of 2026-09-14
| Tab | Registry key | Entries |
|---|---|---|
| Entrance | entrances | 11 |
| Animation | text | 18 |
| Design | skins | 28 |
| Effects | effects | 0 |
| Borders | borders | 8 |
| Two-Text | sequences | 12 |
Warning
A tab with 0 entries is removed from the rail once the registry loads, so Effects never shows. The Icons row (Logo / Plane / uploaded images, under the Design colour badges) only appears once an active Effect declares an
iconscapability — with no Effect ever active, the Icons row is hidden with it.
Entrance (11)
| Name | Effect |
|---|---|
| Drop | the whole banner drops in from above and bounces to a stop |
| Rise | the banner sinks away and rises back up from below |
| Zoom | the banner collapses to a point and zooms back with a pop |
| Swing | the banner swings down from a top hinge and pendulums to rest |
| Slam | slams down hard — squash on impact, shockwave shake |
| Skid | races in from the left, overshoots and skids back into place |
| Float | the whole banner hovers — a weightless bob with a hint of sway |
| Breathe | the banner breathes — a continuous subtle scale swell |
| Catapult | tips back, launches skyward, falls back in and settles |
| Rubber | pops in like a rubber ball — a decaying jelly wobble |
| Hang | hangs like a signboard — a lazy pendulum sway from the top |
Animation (18)
| Name | Effect |
|---|---|
| Spin | letters spin in (rotation + fade) |
| Flip | card-flip: letters unfold from a vertical sliver |
| Typewriter | letters appear one by one, instant with a tiny pop |
| Elastic | letters land with a 3-swing elastic settle |
| Crossfly | letters fly in ACROSS the banner — entrances travel through neighboring emojis |
| Tracking | letters expand out from a center pile to final spacing |
| Heartbeat | whole word double-pulses once per loop (lub-dub) |
| Bounce | letters drop and bounce twice before settling |
| Drawon | letters DRAW themselves stroke-by-stroke, then fill in (trim paths) |
| Glitch | digital glitch: letters slice into bands that jitter + RGB split flashes |
| Shatter | letters SHATTER into shards that fly out, then reassemble |
| Swoop | letters SWOOP in along true curved arcs (spatial bezier paths) |
| Coinspin | each letter does a full 3D coin flip (backside shading), wave stagger |
| Marquee | infinite ticker — the word scrolls through the banner, perfect loop |
| Swing | letters swing down like pendulums, hinged at the top, with follow-through |
| Smear | fast slide-in with a motion SMEAR — letters stretch along the move, snap back |
| Popcorn | letters POP in random order with real squash-and-stretch |
| Arcin | letters swoop in on curved arcs from above, banking into place |
Design (28)
| Name | Effect | Colour slots |
|---|---|---|
| Ticket | event ticket — concave side notches + perforation dots | 1 · sets its own shape |
| Carbon | carbon fiber — fine diagonal weave stripes (two-color) | 2 |
| Outline | double border — thick white frame + inner hairline | 1 |
| Shadow3d | lifted card — soft offset drop shadow behind the banner | 2 |
| Extrude | stacked 3D depth — layered offset slabs behind the banner | 1 |
| Aura | volumetric sheen — twin colored radial glows drifting inside the fill | 2 |
| Holo | holographic foil — iridescent pastel sweep + drifting sheen | 3 |
| Nebula | deep-space clouds — twin colored nebulae + a starfield | 5 |
| Goldluxe | black-tie luxury — near-black satin + double gold hairlines | 5 |
| Vapor | vaporwave horizon — gradient sky, glowing sun, perspective grid | 5 |
| Circuit | circuit board — trace lines with solder-pad dots | 2 |
| Topo | topographic map — concentric contour rings | 2 |
| Ocean | deep water — layered wave crests over an abyss gradient | 2 |
| Auroraflow | living aurora — three color fields drift and breathe through the dark | 4 |
| Flowlines | dark abstract wave-lines gliding across the surface (the classic) | 2 |
| Meshdrift | moving mesh gradient — four color points slowly wander | 2 |
| Silk | black silk — a soft diagonal light band sweeps slowly, endlessly | 2 |
| Dustmotes | deep velvet with slow-drifting luminous motes | 2 |
| Sunburst | art-deco sunburst — gilded rays fanning up, breathing softly | 2 |
| Breathdark | executive satin that breathes — vignette and hairline in sync | 2 |
| Plusgrid | plus-sign lattice drifting over a dark field | 2 |
| Squiggle | hand-wavy squiggle rows gliding sideways | 2 |
| Hexlattice | honeycomb lattice — the Memescale hex grid, in-banner | 2 |
| Scallops | endless-clouds scallop bands rolling slowly | 2 |
| Diamondweave | interlocking diamond lattice, faintly breathing | 2 |
| Weave | woven cloth — textures.js over-under diagonal strands | 2 |
| Dotfade | dot matrix swelling from the center — textures.js circles | 2 |
| Crosshatch | etched crosshatch — two stroke families shearing past each other | 2 |
Borders (8)
| Name | Effect |
|---|---|
| Rainbow | border color cycles through the spectrum |
| Sparks | tiny lights twinkling along the border |
| Beam | conic beam — a hot comet with a real fading tail laps the frame |
| Entwine | two-tone comets with tails chase each other, entwined |
| Breathe | double frame breathing in counter-phase, halo answering |
| Quarters | four synchronized arcs orbiting the frame — loader-spinner energy |
| Duelarcs | two opposed arcs chasing, widths breathing in counter-phase |
| Stations | twelve frame segments lighting up in sequence around the loop |
Two-Text (12)
| Name | Effect |
|---|---|
| Slide | snap-slide — text shoots in from the left, exits right, second text takes over |
| Pop | center-out pop — letters scale-pop in, pop away, second text pops |
| Zoom | camera cut — text lands from a zoom, racks out on exit |
| Flip | split-flap — letters flap down into place, flap away, board swaps |
| Cardflip | card flip — the whole word flips edge-on and the second text is the back face |
| Typeswap | typewriter swap — types in, backspaces away, types the second text |
| Cascade | soft cascade — letters drift-fade through, silky and quick |
| Glitchcut | glitch cut — text stutters into place, tears away, hard swap |
| Elastic | springy — letters bounce in with real spring physics, zip out clean |
| Backin | spring up past the mark, settle — leans back out below |
| Flipy | letters flip open door-style left to right, flip shut — swap |
| Jackbox | jack-in-the-box — wobble-spring open, snap shut — swap |
A Two-Text preset needs the Second text field, in the knob row, filled in — that's the text it swaps to mid-loop.
The motion system
A motion places a moving image, emoji, logo or profile picture on the stage and animates it, independently of the text animation. Up to 4 motions total — see the styling row, above.
Motion paths
Opens as a modal with two modes:
| Mode | How it works |
|---|---|
| Dots | place up to 12 dots; double-click a dot to remove it; a + button adds one, disabled at 12 |
| Draw | trace the path directly — “it only moves forward” |
| Control | Accepts |
|---|---|
| Size | 5% – 400% |
| Traversals per loop | 1×, 2× or 3× |
| Motion feel | Steady (linear) or Smooth |
| Rotate along path | on/off — the element's own rotation follows the path's direction |
| Mirror | adds a linked twin on the other side, position and rotation mirrored, size shared; once on, Flip ↔ and Flip ↕ sub-toggles appear |
Motion presets
10 named motions, applied instead of a freehand path:
| Name | Effect |
|---|---|
| Hover | gentle levitation — perfect for a logo |
| Bounce | one confident hop per loop |
| Sway | barely-there side to side |
| Circle | small smooth orbit |
| Pendulum | swings like it's hanging |
| Pulse | breathes in place |
| Rock | tilts side to side |
| Drift | slow floating figure-eight |
| Heartbeat | double-thump pulse |
| Orbit | circles while spinning |
A third source, the Emoji picker modal, lets you pick any premium emoji to use as the moving element for either a path or a preset.
Create → export
From an open design to a delivered pack
- Every change — text, colour, a knob, a rail pick, a motion — debounces 350ms, then re-renders the stage preview.
- The workspace draft auto-saves to your browser's local storage as you go, restoring itself if you leave and come back. This is separate from an explicit Save (top bar), which writes to your permanent collection.
- Click Export, in the top bar.
- Name the pack — up to 48 characters, placeholder falls back to the banner text, then “My Emoji Pack.” The panel shows the exact title the finished pack will post under: “{name} @memescaleai”.
- Click Generate pack.
- The job is queued, then moves Building → Uploading, shown as “Building {done}/{total} designs” then “Uploading {done}/{total} emojis.” If Telegram throttles the upload, the panel shows “Telegram paused uploads — resumes in {mm:ss}.”
- On success: “Success — check your DMs,” with a View in Telegram button. The finished design is also saved silently to your collection under the same name, equivalent to hitting Save yourself.
- Cancel, while a job is running, stops the render process and deletes the half-built sticker set from Telegram.
Note
Delivery is always through
@memescalebot, to your Telegram DM — never through your own bot, even if you picked one for the export. Your own bot can't message you until you've sent it/start;@memescalebotalready can, because logging in required a DM to it.
Finished pack naming
| Input | Output |
|---|---|
| You type (pack name) | MEMESCALE |
| Posted title | MEMESCALE @memescaleai |
| Set name | mzd1a2b3c4d_by_yourbot — mzd+ 8 hex characters +by + your bot's username |
| Share link | t.me/addemoji/mzd1a2b3c4d_by_yourbot |
The pack title is the cleaned name plus “ @memescaleai”, truncated to 64 characters total.
Upload order: the first 8 tiles go up in one call that creates the sticker set. Any tiles beyond 8 (an 11-cell divider's 9th–11th) are added one at a time, with a fixed 0.7-second pause between each. Telegram flood-wait responses are retried automatically, up to 10 attempts.
** It refers to the renderer trimming, inside each individual tile, whatever geometry never reaches that tile's own 512×512 window (with a 40-unit slack margin) — an optimisation invisible in the output.
Every finished tile is capped at 64KB, Telegram's per-sticker ceiling; a design that can't fit fails the export outright rather than shipping a degraded tile.
Once delivered, the finished banner also appears back in Dashboard → Emoji Design → Banner as a gallery card, and under a “Banners” heading in the emoji picker of every message editor that has one — inserted as the whole 8-tile strip in one click. That insert button is disabled if any tile is missing its emoji glyph.
Limit
A dashboard export always produces exactly one design of 8 tiles.
Limits
Field caps
| Field | Cap |
|---|---|
| Banner text | 24 characters |
| Second text (Two-Text) | 24 characters |
| Pack name (Export) | 48 characters |
| Save-design name | 48 characters |
Uploads
| Type | Cap |
|---|---|
| Image (From Files) | 4MB — “image over 4MB” |
| Lottie JSON | 4MB — “lottie over 4MB” |
Font (.ttf / .otf) | 3MB — “font over 3MB” |
Account and render caps
| Limit | Value |
|---|---|
| Saved designs, per account | 200 |
| Saved design spec size | 16384 bytes — “spec too large” |
| Concurrent packs generating, same account | 4 |
| Global pack queue, whole platform | 48 |
| Pack job timeout | 45 minutes |
| Tile size ceiling (Telegram) | 64KB per tile |
Pack management and fleet minting
/mypacks lists every pack you've created, 10 per page. Each one opens a detail card with 6 buttons for editing, adding to, sharing or deleting it.
Dividers
A divider is a horizontal rule built from custom emoji cells, picked from a catalog or minted on demand. The same picker inserts it into any message…