To get started, click on any item in the screen to change its color, then click the color box to choose a color.

Color picker

Confirm

To change screen background:

Edit

Dark mode

Calm

Professional

Screen

A smart prototyping tool for the web.

Test your UI and color combination ideas without having to design or code them.

Code

body:

h1 { color: }

h3 { color: }

.logo { color: }

.navitems { color: }

.hero-button { background-color: }

.sign-in-button { background-color: }

.register-button { background-color: }

Copy

Screen

A smart prototyping tool for the web.

Test your UI and color combination ideas without having to design or code them.

Confirm

Colors

Click to pick colors

Confirm

To change screen background:

Edit

Dark mode

Calm

Professional

Code

body:

h1 { color: }

h3 { color: }

.logo { color: }

.navitems { color: }

.hero-button { background-color: }

.sign-in-button { background-color: }

.register-button { background-color: }

Copy