Support Frix is a customizable support button you embed with a single tag. It works in React, Vue, Angular, Svelte and plain JavaScript - fully isolated, fully themeable, and wired to Telegram out of the box.
<script type="module"
src="https://support.frix.me/widget/support-frix-widget.js"></script>
<support-frix-widget
api-key="YOUR_API_KEY"
primary-color="#6366f1"
auth-mode="both"
></support-frix-widget>That's the whole integration. Try the live button in the bottom-right corner.
Works everywhere your app runs
Why Support Frix
Built to disappear into your product and show up only when your users need it.
One web component works in React, Vue, Angular, Svelte or plain HTML. No SDK, no wrappers - just one tag.
Rendered inside Shadow DOM. Your page styles never break the widget, and the widget never leaks CSS into your app.
Set the accent color, radius, position, label and identity mode with plain HTML attributes - no build step required.
Every ticket is stored in your database and mirrored to a Telegram channel in real time, so your team never misses one.
Answer from the dashboard or straight from Telegram. Your reply lands back inside the user's widget instantly.
Define categories per platform. Users pick one when they write in, so every request arrives pre-sorted and labelled.
How it works
No backend glue on your side. You embed, your users write, you reply.
Add one script tag and one element to your app. Pick the color, position and identity mode that fit your brand.
They choose a category and type their message. Identify by name + email, by Telegram, or let them choose - your call.
Tickets appear in your dashboard and Telegram channel. Reply from either, and the answer shows up in the widget.
Identity, your way
Pick the verification that matches your audience with a single attribute.
auth-mode="email"Frictionless for public sites. Users leave a name and email; replies surface inside the widget via a private ticket link.
auth-mode="telegram"Best for communities. Users confirm a 6-digit code from the bot, so every reply reaches them on Telegram too.
auth-mode="both"Offer both and let each user decide. Great default - broad reach without losing the Telegram power-user loop.
Get started
The exact integration for your stack. Swap in the API key from your dashboard and you're live.
<!-- 1 - Load the widget once, before </body> -->
<script type="module"
src="https://support.frix.me/widget/support-frix-widget.js"></script>
<!-- 2 - Drop the button in anywhere -->
<support-frix-widget
api-key="YOUR_API_KEY"
primary-color="#6366f1"
btn-position="bottom-right"
btn-label="Support"
auth-mode="both"
></support-frix-widget>Every option is a plain HTML attribute - no build step needed.
| Attribute | Default | Description |
|---|---|---|
| api-key | - | Required. Platform key from your dashboard. Routes tickets to the right project. |
| api-url | https://support.frix.me/api | Base URL of the Support Frix API. |
| auth-mode | both | How users identify: email, telegram, or both. |
| primary-color | #6366f1 | Accent color for the button and highlights. |
| btn-radius | 9999px | Corner radius of the launcher button. |
| btn-position | bottom-right | bottom-right or bottom-left. |
| btn-label | Support | Text shown on the launcher button. |
| title | How can we help? | Heading shown at the top of the modal. |
| theme | light | light, dark, or auto color scheme for the panel. |
Framework guides, configuration, identity modes, the Telegram setup walkthrough and the complete API reference - all in one categorized place.