Templates

If individual elements are not explained in sufficient detail or the integration is complex, should here you can download some of the templates. Individual parts of the framework are available here as a demo and can be applied through the MIT license for own commercial projects.


Typography

The term comes from ancient Greek and is best translated as "working with scripture". Nowadays, typography is an important part in any design process. The right font choice and font size are crucial for the information to be transmitted. Line spacing, letter spacing and line length are other important points that improve the readability of information. The templates under this point deal with the Presentation of information.

Headlines

In order to deal specifically with the structure of texts, we have created the headings template. It should show how information should be prepared to address readers. As well as what structure Texts should have to give the reader all the important information.

Template Headings

Writing Blogs

The template Blogs offers the user an easy way to download the skeleton of a blog page. The blog page consists of a page navigation and a content area in which the blog entries are displayed.

Template Blog

Information Website

The information website is the perfect template for any website with a lot of information. It is purely intended for the visitor to present as much information as possible in a clear way. The template consists of a header, content and footer. To the visitor The page was not overwhelmed with text some images were used to bring the variety in the template.

Template Informationwebsite

User Input

The user input illustrates how the input elements of the framework can be used and combined. The template offers a standard form which can be used, for example, for a registration or a purchase.

Template User Input

Semantik

This section focuses on the different layout options for developing web pages. In addition, another important component in the web development is shown, namely the semantics. She makes sure that The individual information of a website are better structured and more meaningful.

Backbones

Below this point are some templates that show different layout options, such as graphs or pictures. Further, the templates show how the semantic elements should be used.

Featured Graphic

Template Graphic

Featured Photo

Template Photo

Side Navigation

Template Sidenav

Grid System

Since our framework contains a complex grid system, there are also templates that show the possibilities it offers and which layout options can be realized with it. Below this point is specific to the use of the grid system for layout purposes.

Three Boxes

Template three Boxes

Five Boxes

Template five Boxes

Advanced Grid

Template advanced Grid

Power Grid

Template strong Grid

Logic

Below this point are ready-made templates for different areas. The two standard pages Registration and registration can be downloaded here. There is also a template for pictures or photos on a web page as well as a template for the parallax effect.

User Login

The user login shows how the login of a page might look like. It consists of a login form as well a background picture. The input fields as well as the background can be adapted as desired.

Template Login

User Registration

The user registry shows what a possible registration page might look like. It also consists of a form and a background picture. The input form as well as the background can be adapted as desired.

Template Registration

Parallax

The Parallax effect is an interactive effect in web design. In this effect, different objects are on different levels of each other positioned whereby a kind of spatiality and movement is simulated. This template is perfect if you want to bring movement to your website.

Template Parallax