---
sourceDocument: Brazil Build or modify applications
sourceDocumentLink: https://www.servicenow.com/docs/r/application-development

 Release :

    - brazil

ft:locale :

    - en-US

ft:publication_title :

    - Brazil Build or modify applications

ft:clusterId :

    - cadev

bundleId :

    - cadev

workflow :

    - Development, Data, and Analytics


---

# Exploring Lux

# Exploring Lux {#ariaid-title1}

Release version: Brazil  
Updated September 29, 2026  
![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 minutes to read  
Lux is a framework for building widget-based UI experiences on a ServiceNow instance.

Lux streams the rendered HTML to the browser and hydrates it into a fully interactive single-page app.

Your app is served under /aiux/\<app-basename\>/\<route\>. The `aiux` prefix is the platform's public URL surface. It also appears in package names such as
@servicenow/aiux-components-core and in API identifiers such as
`AIUXElement`. Those are real names you type in code, and they don't change.

## Faster page loading {#exploring-lux__lux-server-rendered-then-hydrated}

When a user navigates to your Lux app they will see fully rendered content immediately, with no loading spinners or blank screens. Subsequent navigation happens client-side, so the app feels like a single-page app.

Lux provides the following benefits:

* The browser shows the first screen quickly.
* The markup is accessible and search engines can read it.
* Data retrieval is efficient. Loaders run on the server, near your ServiceNow instance. This helps prevent the delay of a round trip that client-side fetches cause.

## Built on Lit widgets {#exploring-lux__lux-built-on-lit-widgets}

You build all Lux UI with Lit widgets. Your widgets extend a platform base class from the package @servicenow/aiux-components-core. Use `AIUXElement` for a simpler presentational
widget or a page. Never extend `LitElement` directly.

The base classes carry the SSR, styling, and data-fetching plumbing:

* Tailwind and DaisyUI styling, applied automatically through adopted stylesheets, so your widgets inherit the design system without manual imports.
* SSR-safe `this.loaderData`, holding the result of your widget's `static async loader(ctx)` method during both server render and client hydration.
* `getLayoutData(key)`, reading layout-level data shared across all pages.
* The `static async loader(ctx)` convention, a framework-managed pattern for fetching data before render.

{#exploring-lux__ul_tp3_mzz_skc}

The fundamental building blocks are described in the following table.
{#exploring-lux__table-lux-building-blocks__entry__2}

| Building block | Description |
|-|-|
| aiux.json | The app manifest: app name, URL basename, landing route |
| Pages | Lit widgets under pages/; directory structure maps directly to URLs (file-based routing) |
| Loaders | A `static async loader(ctx)` method on a page or widget that fetches data on the server before render; the result becomes `this.loaderData` |
| Widgets | Reusable Lit UI units extending `AIUXWidgetElement` (discoverable, self-fetching) or `AIUXElement` (presentational) |
| Layout | A single pages/layout.js that renders the app chrome (header, navigation, footer) around each page |
| Context API | `createContext()` for sharing data across widgets without prop-drilling |
[Table 1. Lux building blocks]

{#exploring-lux__table-lux-building-blocks}

## What you build with it {#exploring-lux__lux-what-you-build-with-it}

You build a scoped ServiceNow application that depends on Lux. Your application lives in its own repository, separate from Lux itself. It deploys to a ServiceNow instance on its own schedule using the [ServiceNow SDK](https://www.servicenow.com/docs/vjwMQCPik_lepVS~F88baw "ServiceNow SDK is the command-line tool that scaffolds, builds, and deploys a Lux application. It's distributed as the npm package @servicenow/sdk and invoked as now-sdk.").

## Who this is for {#exploring-lux__lux-who-this-is-for}

Lux is for developers building custom UI experiences on a ServiceNow instance. You should know JavaScript (ES modules) and basic HTML and CSS, plus web components or a component framework. Prior Lit experience helps but isn't required.