Lapus | 多用途HTML模板+网页构建器
通过电子邮箱注册
已经拥有账号？ 登录

Colors

These modular elements can be readily used and customized across pages and in different blocks.

Explore all of Lapus's modular elements
at the Element Index Page →

Theme Colors

Lapus supports 3 theme colours in each preset scheme. Colors are referred to as 'primary', 'primary-1' and 'primary-2'. These colors can be used with the prefix bg-- followed by the name of the color to change the background color of an element. 

<div class="bg--primary"><span>Primary</span></div>
<div class="bg--primary-1"><span>Primary 1</span></div>
<div class="bg--primary-2"><span>Primary 2</span></div>
<div class="bg--dark"><span>Dark</span></div>
<div class="bg--secondary"><span>Secondary</span></div>
Primary
Primary 1
Primary 2
Dark
Secondary

Typography Classes

Using the prefix color-- along with the name of the color (as described above) you can easily change the color of typography elements such as headings or paragrphs. 

<span class="color--primary"></span>
I'm a primary colored heading I'm a primary-1 colored heading I'm a primary-2 colored heading

Button Classes

Using the prefix btn-- along with the name of the color (as described above) you can easily change the color of button elements.

Note: for more on buttons visit the buttons element page here. 

<a class="btn btn--primary type--uppercase" href="#">
	<span class="btn__text">
		Primary Colored Button
	</span>
</a>
Primary Colored Button