chore: Update Telegram icon to official logo design#1176
Merged
Conversation
Updated the Telegram icon SVG to match the official Telegram logo design without the tail, as requested by the mobile team. Co-authored-by: Brian August Nguyen <brianacnguyen@gmail.com>
Contributor
📖 Storybook Preview |
Contributor
📖 Storybook Preview |
Contributor
📖 Storybook Preview |
georgewrmarshall
pushed a commit
that referenced
this pull request
May 20, 2026
## Release 41.0.0 This release adds mobile layout components (`TitleAlert`, `SectionHeader`, `SectionDivider`), exports shared types for the new cross-platform contracts, and updates the `Telegram` icon asset on web and mobile. There are no breaking API changes. ### 📦 Package Versions - `@metamask/design-system-shared`: **0.19.0** - `@metamask/design-system-react`: **0.23.1** - `@metamask/design-system-react-native`: **0.26.0** ### 🔄 Shared Type Updates (0.19.0) #### Component Type Additions ([#1131](#1131), [#1175](#1175)) **What Changed:** - Exported `TitleAlertPropsShared` for alert-style title layouts (severity, title row, optional description) - Exported `SectionHeaderPropsShared` for section headings with optional accessories and icon shortcuts - Updated the shared `Telegram` icon asset to match the official Telegram logo ([#1176](#1176)) **Impact:** - Enables consistent `TitleAlert` and `SectionHeader` implementations across React and React Native - Continues ADR-0003/ADR-0004 const-object + string-union pattern adoption - Apps using `IconName.Telegram` on either platform get the updated glyph without API changes ### 🌐 React Web Updates (0.23.1) #### Changed - Updated the `Telegram` icon asset to match the official Telegram logo ([#1176](#1176)) ### 📱 React Native Updates (0.26.0) #### Added - Added `TitleAlert` for alert-style headings with a severity icon, title row, and optional description in modals, bottom sheets, and other compact surfaces ([#1131](#1131)) - Added `SectionHeader` for section titles with optional start and end accessories, icon shortcuts, and an inline title accessory ([#1175](#1175)) - Added `SectionDivider` as a horizontal rule with a muted top border and default vertical spacing for separating screen sections ([#1174](#1174)) #### Changed - Updated the `Telegram` icon asset to match the official Telegram logo ([#1176](#1176)) ###⚠️ Breaking Changes None in this release. ### ✅ Checklist - [x] Changelogs updated with human-readable descriptions - [x] Changelog validation passed (`yarn changelog:validate`) - [x] Version bumps follow semantic versioning - [x] design-system-shared: **minor** (0.18.0 → 0.19.0) — new shared type exports + icon asset update - [x] design-system-react: **patch** (0.23.0 → 0.23.1) — `Telegram` icon asset update only - [x] design-system-react-native: **minor** (0.25.0 → 0.26.0) — new components + icon asset update - [x] Breaking changes documented with migration guidance — N/A (no breaking changes) - [x] Migration guides updated with before/after examples — N/A (no breaking changes) - [x] PR references included in changelog entries ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've reviewed the [Release Workflow](./.cursor/rules/release-workflow.md) cursor rule - [x] All tests pass (`yarn build && yarn test && yarn lint`) - [x] Changelog validation passes (`yarn changelog:validate`) ## **Pre-merge reviewer checklist** - [ ] I've reviewed the [Reviewing Release PRs](./docs/reviewing-release-prs.md) guide - [ ] Package versions follow semantic versioning - [ ] Changelog entries are consumer-facing (not commit message regurgitation) - [ ] Breaking changes are documented in MIGRATION.md with examples — N/A - [ ] All unreleased changes are accounted for in changelogs
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Updated the Telegram icon SVG to match the official Telegram logo design. The previous icon had a "tail" on the paper plane that didn't match the official Telegram brand guidelines. The new icon matches the design provided in the Figma files and aligns with what the mobile team requested for the "Continue with Telegram" social login feature.
What changed:
packages/design-system-shared/src/assets/icons/telegram.svgwith the new SVG pathyarn generate:iconswhich regenerated:packages/design-system-react-native/src/components/Icon/assets/telegram.svgpackages/design-system-react/src/components/Icon/icons/Telegram.tsxRelated issues
Fixes: Design request from mobile team for Telegram social login feature
Manual testing steps
Screenshots/Recordings
Before
The icon had a tail on the paper plane which didn't match the official Telegram logo.
After
The icon now matches the official Telegram logo design as specified in the Figma design files.
Pre-merge author checklist
Pre-merge reviewer checklist
Slack Thread