Skip to content

Latest commit

 

History

History
84 lines (60 loc) · 5.83 KB

README.md

File metadata and controls

84 lines (60 loc) · 5.83 KB

Telegram UI

Overview

Telegram UI kit equips you with a variety of pre-designed components and tools to help you quickly develop high-quality Telegram applications. Whether you're aiming to create custom client apps, integrate Telegram functionality, or develop unique bots, this toolkit is your go-to resource.

Features

  • Cross-Platform Design Consistency: Use built-in support for iOS’s Human Interface Guidelines and Android’s Material Design to maintain a uniform look and functionality across both platforms.
  • Pre-designed UI Components: Access a variety of ready-to-use UI components inspired by Telegram’s interface, designed for easy integration and customization.
  • Responsive Design: Create apps that look and work great on any device, using flexible layouts and media queries to ensure optimal display and functionality.
  • Telegram Color Scheme Support: Apply Telegram’s native color schemes to your apps for consistent branding and a familiar user experience.

🖥 Environment Support

  • Modern browsers
  • Server-side Rendering
  • All known Telegram clients
Edge
Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Safari
Ios
>= 79 >= 78 >= 73 >= 12.0 >= 12.0

Resources

Installation

npm i @telegram-apps/telegram-ui
yarn add @telegram-apps/telegram-ui
pnpm add @telegram-apps/telegram-ui

Usage

import '@telegram-apps/telegram-ui/dist/styles.css';

import { AppRoot, Placeholder } from '@telegram-apps/telegram-ui';

const App = () => (
  <AppRoot>
    <Placeholder
      header="Title"
      description="Description"
    >
      <img
        alt="Telegram sticker"
        src="https://xelene.me/telegram.gif"
        style={{ display: 'block', width: '144px', height: '144px' }}
      />
    </Placeholder>
  </AppRoot>
);

export default App;

🤝 Contributing PRs Welcome

Active Contributors of Telegram-Mini-Apps/TelegramUI - Last 28 days

Contributions are welcome! To contribute, fork the repository, make your changes, and submit a pull request. We look forward to your innovative ideas and improvements.

License

This Telegram UI Kit is available under the MIT License. Use it freely in both personal and commercial projects.

The library was skillfully crafted by mainsmirnov, with the generous sponsorship of TON Foundation.