Our Latest Events

Get trial version
  • Events
  • Presentation of the Utouch app

Solid Buttons

Small Button
Button
Large Button

Button With Icon

google
Sup title Small Button

Sup title Button

Sup title Large Button

Icon right

Button With Border

Small Button
Button
Large Button

Buttons Colors

Primary Button
Secondary Button
Green Button Green Light Button
Black Button
Orange Button
Red Button
Grey Button
Orange-Light Button
Yellow Button
Lime Button

Buttons Full Width

Primary Button
Secondary Button
Green Button Green Light Button
Black Button
Orange Button
Red Button
Grey Button
Orange-Light Button
Yellow Button
Lime Button

Buttons Shadow

Primary Button
Secondary Button
Green Button Green Light Button
Black Button
Orange Button
Red Button
Grey Button
Orange-Light Button
Yellow Button
Lime Button

Heading 1

48 px

Font: Nunito Regular

Color: #273f5b

Heading 2

38 px

Font: Nunito Regular

Color: #273f5b

Heading 3

36 px

Font: Nunito Regular

Color: #273f5b

Heading 4

32 px

Font: Nunito Regular

Color: #273f5b

Heading 5

24 px

Font: Nunito Regular

Color: #273f5b

Heading 6

18 px

Font: Nunito Regular

Color: #273f5b

IV Columns Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy.

III Columns Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

II Columns Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

I Third / II Thirds Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.

II Thirds / I Third Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

I Fourth / III Fourths Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.

I Fourth / III Fourths Layout

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.

Qit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus,nunc nobis videntur parum clari, fiant sollemnes. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Qit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus,nunc nobis videntur parum clari, fiant sollemnes. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Qit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus,nunc nobis videntur parum clari, fiant sollemnes. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Qit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat est etiam processus dynamicus,nunc nobis videntur parum clari, fiant sollemnes. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Dark background text selection

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.

Primary background text selection

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.

Light background text selection

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.

  1. Qolor sit amet, consectetuer;
  2. Investigationes demonstraverunt;
  3. Dam liber tempor cum soluta;
  4. Quarta decima et quinta.
User Interface

Heading Style-left

Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.
User Interface

Heading Style-center

Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.
User Interface

Heading Style-right

Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.
User Interface

Heading Style - subtitle small

Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima.
Title Color: #273f5b
Font Size Title: 48px
Font Size Txt Description: 16px
Color Txt Description: #4b5d73

Forms Elements

Forms Elements With Icon

Alerts Examples

Range Sliders

Typography Tags

Tag - abbr
Quarta decima et quinta.
Tag - abbr
Quarta decima et quinta.
Tag - cite
Quarta decima et quinta.
Tag - del
Price 100$ - Price 59.99$ !!!
Tag - em
Mirum est notare
Tag - small
Quarta decima et quinta.
Tag - sub
H2SO4
Tag - sup
X3
Tag - ol(standard)
  1. Qolor sit amet, consectetuer;
  2. Investigationes demonstraverunt;
  3. Dam liber tempor cum soluta;
  4. Quarta decima et quinta.
Tag - ol(primary)
  1. Qolor sit amet, consectetuer;
  2. Investigationes demonstraverunt;
  3. Dam liber tempor cum soluta;
  4. Quarta decima et quinta.
Tag - ol(secondary)
  1. Qolor sit amet, consectetuer;
  2. Investigationes demonstraverunt;
  3. Dam liber tempor cum soluta;
  4. Quarta decima et quinta.

Theme Icons

<svg class="utouch-icon"><use xlink:href="#utouch-icon-calendar-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-calendar-2"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-cancel-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-checked"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-clock-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-dot-arrow"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-edit"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-expand"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-flag-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-home-icon-silhouette"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-icon252"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-icon-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-letter"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-link-chain"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-media-play-symbol"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-message"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-message-closed-envelope-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-minus"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-musical-note-2"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-picture"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-placeholder-3"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-placeholder-4"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-play-button-2"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-settings-5"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-star"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-star-half-empty"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-stopwatch"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-team"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-telephone-keypad-with-ten-keys"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-upward-arrow"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-user"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-users"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-worlwide"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-world-map"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-menu-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-google-play"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-chat-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-1496680146-share"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-1496838047-75"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-add"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-alarm"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-apple-logotype-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-left"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-left-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-left1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-right"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-right-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-right1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-arrow-top"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-box"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-cup-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-correct-symbol-1"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-copy"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-search"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-zoom-increasing-button-outline"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-quotes"></use></svg>
<svg class="utouch-icon"><use xlink:href="#utouch-icon-lnr-star"></use></svg>
Send a Message

Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magnais.