arya-blue
luna-amber
luna-blue
luna-green
luna-pink
nova-dark
nova-light
saga-blue
vela-blue
LightSwitch

Automatically sets a light or dark theme based on the OS settings. Put it in your template like:

<pe:lightSwitch selected="\#{userBean.theme}"/>

userBean should be a session scoped bean with a String type theme property (with both getter and setter). Then set the theme in your web.xml like:

<context-param>
    <param-name>primefaces.THEME</param-name>
    <param-value>\#{userBean.theme}</param-value>
</context-param>

This showcase uses the LightSwitch component.

See also the PrimeFaces themes documentation.

OmniFaces CombinedResourceHandler

With combined resources, we cannot find the theme link in the DOM tree. Therefor we need to add a node for the new theme.
Important: this node will be added as the last element in the body. If you added a custom style sheet with overrides, make sure to use more specific rules. Equal rules will be overruled by the switched theme.

Components and more
Documentation pe:
Attributes (move mouse over the names to see data types)
Name Description
No attributes available for this component.
PrimeFaces Extensions Showcase - © 2011-2025,PrimeFaces: 15.0.13,PrimeFaces Extensions: 15.0.14-SNAPSHOT,JSF: Apache MyFaces JSF-2.3 Core Impl 2.3.10,Server: Apache Tomcat (TomEE)/9.0.82 (8.0.16),Build time: 2026-02-23 00:32