Template Options

vAPP comes with couples of pre-made template options such as: pre-made color as solid and gradient, boxed layout and patterns. They are very issue to apply in template

Set theme Color

Solid color as template primary color

add vAPP pre-defined class to the <body> elements to apply the theme.

Code Example


                                                <body class="theme-green">

Gradient color as template primary color

add vAPP pre-defined class to the <body> elements to apply the theme.

Code Example


                                                        <body class="theme-gradient-1">

Box Layout Options

Change page layout to Boxed Layout

add vAPP pre-defined class to the <body> elements to apply the theme.

Code Example


                                                <body class="boxed-layout">

Boxed Layout with Pattern

add vAPP pre-defined class to the <body> elements to apply the theme.

Code Example


                                                        <body class="theme-green boxed-layout circles-light">

CSS Class Reference

Solid Color Option

You can apply either solid color or gradient color at a time. Gradient and Solid color won't work at the same time.

More information avilable in the customization page

.theme-green

.theme-blue

.theme-orange

.theme-violet

.theme-orange-light

.theme-firoza

Gradient Color Option

You can apply either solid color or gradient color at a time. Gradient and Solid color won't work at the same time.

.theme-gradient-1

.theme-gradient-2

.theme-gradient-3

.theme-gradient-4

.theme-gradient-5

.theme-gradient-6

Pattern Options

You must have to set layut as boxed-layout to apply the pattern

.circle-pattern

.circle-light

.leaf-pattern

.memphis-pattern

.round-pattern

.spiration-light

.swirl-light

.tic-tac-toe-pattern

.x-pattern

.hexagon

.curls

.darkness

.spiration-dark

.zig-zag-wool