Telegram Nodes · iOS components

Built on Telegram iOS’s own tokens (open-source client, see TG-TOKENS.md): accent #0088FF, chat rows 76 / avatar 60, iOS 26 Liquid Glass capsules 44 and a 64 pt tab bar (Contacts · Calls · Chats · Settings), grouped blocks radius 26. Inter stands in for SF Pro.

Identity · press → slide → release

1 · Rest

2 · Press ≈ 0.3 s

3 · Slides out of the button

4 · Slide along → Dalle

4 · same, on wallpaper

5 · Released → slides back

One gesture, as in the contest file (Toobar · Top · Chats): press the current alias (≈ 0.3 s, like a haptic touch or a chat preview) → a glass capsule slides out of the button to the side — same height, faces only, the current alias first and «New alias» (masks +) last. Keep the finger down and slide along it: the face under the finger takes the accent ring and its name previews under «Chats». Release to switch; the capsule slides back into the button. A plain tap changes nothing. Title context: All chats · as Alex as Dalle · while sliding: as Dalle

Chat rows

Node invite

Design Team6:48 PM

Max invited you · choose who you’ll be

Joined · alias tag in «All»

Design Team

Dallenow

You joined as Dalle · 5 online

Node · unread

Product Guild

Dalle4:57 PM

Max: New mockups are up in Reviews

DM inside a Node (alias context)

Ivanvia Product Guild11:10 AM

Dalle, can you review the new flow?

Join as · alias cards

Privacy line under every alias choice.

Glass · iOS 26 Liquid Glass

On wallpaper

Text

Tinted

Disabled

On white

Text

Tinted

Disabled

Clear light glass: white tint α.30→.16, blur 10, no colour boost — neutral on any background · specular rim brightest top-left / bottom-right · bright inner edge band and a top lensing highlight in place of refraction · soft shadow.

Buttons

Primary 50

Disabled

Secondary

Destructive

Row action

Branch rail

States
Active (lens black α.075, accent label) · unread badge · live dot #FF3B30 · groups Feed / Rooms / Apps. The composer shows only in chat branches.

Template cards

Link field · states

t.me/design_team

Available

t.me/designers

Taken — try another

t.me/design team!

Letters, digits and _ only

Telegram iOS tokens

#0088FFaccent

#000000primary text

#8E8E93secondary · dates

#C8C7CCseparator

#EFEFF4grouped bg

#6D6D72section header

#B6B6BBmuted badge

#21C004read ✓ (Classic)

#E1FFC7outgoing bubble

#35C759switch on

#FF3B30destructive

#E5E5EAselected folder

Voice room card

Daily MeetingLIVE

Sprint 14 review · 9 min

MXMaxspeaking

OwlMember

KRKiraAdmin

SASamMember

You’ll join as Dalle · mic off