Users

The Right Way - Admin Template

$24 Get template now $24 Buy

Basic user box

It's easy to use and customize user images an user informers.

Default .user container with square image.

Use .user--bordered to add border to user.

Use .user--rounded to add rounded corners.

Wendy Brown

Use .user__name inside .user to add user name.

Custom user sizes

Use predefined classes to modify user sizes.

Default size of user box.

Use class .user--huge to change user box size to huge.

Use class .user--lg to change user box size to large.

Use class .user--xlg to change user box size to xlarge.

User group

Wrap your user list into .user-group to get group of users.

User group with default user size.

User group with huge user box.

Large user boxes inside user group.

Xlarge user boxes inside user group.

Centred elements

Use predefined modifier .user--centred to build user box with centred elements.

Dmitry Ivaniuk
UI/UX Designer

Dolores Wallace
C++ Programmer

Jonathan Foster
Web Developer

Wendy Brown
CEO/CO Founder

Examples

Use this examples wherever you want in this template.

Dmitry Ivaniuk

Default example with rounded corners and borders. Also contained with .user__name container.

Tracey Newman
Regular account

Jonathan Foster

Large example with rounded corners and borders. It is possible to use all typography elements here.

Dolores Wallace
Administrator
Last visit: 14:23

Maurice Collins
Administrator/Manager

Extra large example with 3 rows for information.

User button

Same size and style button as user box.

Default size of user button.

Use class .user--huge to change user button size to huge.

Use class .user--lg to change user button size to large.

Use class .user--xlg to change user button size to xlarge.

Users

Basic user box

Custom user sizes

User group

Centred elements

Examples

User button

Template settings

Information

Layout option

Backgrounds

Header options

Container

Navigation options

Sidepanel options

Content options