Put the option where players sign in
For account or saved-progress games, show Sign in with Vihar ID on the game's own login screen. It can sit alongside Sign in with Google, Apple or another provider. Keep it readable, keyboard-accessible and available on mobile; do not hide it only in a footer or the Vihar listing.
The SDK mount method supplies the official Vihar icon, sign-in label and explanatory text. Sign-in and consent happen in a compact Vihar popup without website navigation. You may style a custom button to match your game while retaining the icon and exact sign-in label. Call signIn directly from the click handler so the browser allows its popup.
Explain the benefit without overpromising
Suggested text for an integrated game: “One player ID across community games. Sign in with Vihar ID to keep your play activity and supported cloud saves together.”
For games that have not wired cloud saves, omit the cloud-save claim until it is working. Explain which checkpoints save, whether guest play is temporary and what happens when the player signs out. A Vihar ID does not automatically transfer purchases, friends or progress between unrelated games.
Use the official Vihar icon
Studios integrating Vihar ID may use these official SVG icons on their own game websites and sign-in buttons. Use the dark emblem on light surfaces and the light emblem on dark surfaces. Keep its original proportions and colors, use at least 20 × 20 pixels, and leave clear space between it and the label.
Keep “Sign in with Vihar ID” visible beside the icon. An icon alone is not a clear sign-in option. In HTML, give the image an empty alt attribute because the adjacent button text already names Vihar ID. You may host a copy of the SVG with your game if your content policy blocks external images.
Choose a ready-made branded button
Choose one mount call for your container. All variants include the official icon and open the same Vihar sign-in window. With compact mode, include your own nearby explanation and a permissions link. Listen for vihar:signin on the container to receive the connected player, as shown in the browser SDK guide.
// Default: dark button, Vihar icon, explanation and help link.
vihar.mount("#vihar-login");
// Alternative: a light button for a light login screen.
vihar.mount("#vihar-login", { theme: "light" });
// Button and status only, if your screen already explains Vihar ID.
vihar.mount("#vihar-login", { theme: "dark", compact: true });Use an accessible custom button
Replace YOUR_SAVED_GAME_ID with your listing ID. If the game already has an SDK instance, reuse it. Provide a visible sign-out control that calls vihar.signOut, clear errors, and a link to Vihar's game-permissions guide. Wire gameplay and save hooks using the browser SDK guide. Never collect Vihar credentials in a form on your own site.
<button type="button" id="vihar-signin">
<img src="https://vihar.online/brand/vihar-emblem-inverse.svg"
width="24" height="24" alt="" aria-hidden="true">
<span>Sign in with Vihar ID</span>
</button>
<p id="vihar-message" role="status"></p>
<style>
#vihar-signin {
display: inline-flex; align-items: center; gap: 10px;
min-height: 46px; padding: 11px 18px;
background: #27241f; color: #fffefa;
border: 1px solid #27241f; border-radius: 9px;
font: 600 14px system-ui; cursor: pointer;
}
#vihar-signin img { width: 24px; height: 24px; }
#vihar-signin:focus-visible {
outline: 3px solid #c77b53; outline-offset: 3px;
}
#vihar-signin:disabled { opacity: .6; cursor: wait; }
</style>
<script type="module">
import { createViharId } from "https://vihar.online/sdk/vihar-id.js";
const button = document.querySelector("#vihar-signin");
const message = document.querySelector("#vihar-message");
const vihar = createViharId({ gameId: "YOUR_SAVED_GAME_ID" });
button.addEventListener("click", async () => {
button.disabled = true;
try {
const player = await vihar.signIn();
message.textContent = "Signed in as @" + player.username;
// Load this game's progress; start tracking when gameplay begins.
} catch (error) {
message.textContent = error.message;
} finally {
button.disabled = false;
}
});
</script>Promote the connection without requiring login for direct play
A no-login game can show “Play activity connected with Vihar” and link to the player's dashboard. It does not need an identity button or an account gate. Tell signed-in players that supported activity is recorded; let anonymous players start immediately.