Hudhud Maps - Live Demo

> ## Documentation Index > Fetch the complete documentation index at: https://docs.hudhud.sa/llms.txt > Use this file to discover all available pages before exploring further. # Displaying a Map > Render vector maps using MapLibre-compliant styles and the KSA road network. Hudhud provides vector tile styles optimized for performance and local accuracy in Saudi Arabia. These styles are compatible with any MapLibre GL JS (web) or native SDK (mobile). ## Available Styles Hudhud provides two standard base styles, both offering full bilingual support and high-performance vector rendering. `variant=light` (default) - Optimized for day-time navigation. `variant=dark` - Optimized for low-light and night-time use. ## Simple Implementation The fastest way to get a map running is to include the library and initialize it with your **Publishable Key**. ```html theme={null}

``` ## Interactive Switching (Advanced) For applications that need to switch themes or languages dynamically without a page reload, you can use the `map.setStyle()` method. ```html theme={null} Hudhud Maps - Live Demo

``` **RTL Plugin Requirement**: If you see Arabic labels rendered with detached letters or in reverse order, ensure the RTL plugin URL is correct and that `setRTLTextPlugin` is called before the map is initialized. ## Integration Resources Learn how to use your Publishable Key securely in the frontend. See the full list of query parameters for the Styles API.