# Responsiveness

realvirtual.io is designed to run on a variety of devices, including **PCs, mobile devices, WebGL, and different screen resolutions**. Achieving a responsive and adaptive UI across these platforms can be challenging. To simplify this, **realvirtual.io includes special scaler scripts** to handle different screen sizes and resolutions automatically. You can adopt the settings based on your special application needs.

### **Scaler Scripts for Responsive UI**

#### **Toolbar Scaler**

The **Toolbar Scaler** ensures that toolbars scale properly depending on screen size and platform.

* **Adjusts toolbar height and scale** dynamically.
* **Handles scaling for different screen resolutions**, ensuring UI elements remain accessible.
* **Platform-specific deactivation:**
  * Allows disabling elements for **Linux, Windows, and WebGL** when needed.

<figure><img src="https://260262196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpYxFg97YnJX96UzNNTSd%2Fuploads%2Fgit-blob-fd651d0b82a11dcf36a8a3c8b6b54ceb082998e8%2Fresponsiveness.png?alt=media" alt=""><figcaption><p>Toolbar Scaler</p></figcaption></figure>

#### **Overlay Button Scaler**

The **Overlay Button Scaler** is used for the ovlerlay buttons on the right hand side.

* **Dynamically scales UI buttons based on screen size.**
* **Custom width and height settings** for different screen resolutions.
* **Supports platform-based UI adjustments** (e.g., different behaviors for **Android, iOS, WebGL**).

<figure><img src="https://260262196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpYxFg97YnJX96UzNNTSd%2Fuploads%2Fgit-blob-bdaf8b928401136c6500dd501c98e4c73ef2a8f6%2Fresponsiveness-overlaybuttons.png?alt=media" alt=""><figcaption><p>Oberlay Button Scaler</p></figcaption></figure>
