1. Køkken
  2. Bad
  3. Inspiration
  4. Bæredygtighed
Book møde
Forside / Styleguide

Styleguide

Theme: invita

Headings (MOBILE) (TABLET) (DESKTOP)

This is a prominent heading

It can be used on any tag not only the H1 tag

This is a H1 headåäö

This is a preamble paragraph with some extra text to show it

This is a H1 heading
with multiple lines

This is a paragraph with some text

This is a H2 headåäö

This is a paragraph with some text

This is a H2 heading
with multiple lines

This is a paragraph with some text

This is a H3 headåäö

This is a paragraph with some text

This is a H3 heading
with multiple lines

This is a paragraph with some text

This is a H4 headåäö

This is a paragraph with some text

This is a H4 heading
with multiple lines

This is a paragraph with some text

This is a H5 headåäö

This is a paragraph with some text

This is a H5 heading
with multiple lines

This is a paragraph with some text

This is a H6 headåäö

This is a paragraph with some text

This is a H6 heading
with multiple lines

This is a paragraph with some text

Paragraphs

Example of "paragraph-preamble-a"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Example of "paragraph-preamble-b"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Example of "paragraph-lead"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Example of "<p>"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Example of "paragraph-small"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Example of "paragraph-byline"

Good user interface design facilitates finishing the task at hand without drawing unnecessary attention to itself. Graphic design and typography are utilized to support its usability, influencing how the user performs certain interactions and improving the aesthetic appeal of the design; design aesthetics may enhance or detract from the ability of users to use the functions of the interface.

Colours

Site common

Backgrounds and tones

Elements/Items

Extra alert

Lists

  • This is an unordered list item
  • This is also an unordered list item
  • This is another unordered list item

Buttons

Links

My link
My link

Forms and inputs

Field must not be empty. Please enter value.
You must enter at least 3 characters
Below you can see which of the validators on this field that are active and who flag an error.
{{ error.name }}

Dividers

This is a divider heading
This is a divider caption

Tabs

This is the content of tab 1 and it is selected initially This is the content of tab 2

Click me to set tab 1 | Click me to set tab 2

Overlays

Testing the overlay

This is the overlay! The styling for this element needs to be at root level. Outside of the page styling.
This is the overlay! The styling for this element needs to be at root level. Outside of the page styling.
Close

Picture ratios

Accordion

Opens item by content falling down

Text 1 Text 2

Quote

Displays a quote with two lines above and under the quote

We are so incredibly impressed by the knowledge and skills that our Magnet designer Ann posessed. She made our vision a reality! The whole process from inspiration to getting the kitchen installed was a smooth experience
Anne Smith
Kitchen Buyer

Icons

We are using material designs icons found here. Since we are separating markup from styling we add the ones we need separately.

<i class="icon icon-loader" style="--size: 1em;"></i>

Tracking

The site uses GTM and below is a simple call of the event you can use

Device support

Detect what the current device supports

Skræddersyede kvalitetskøkkener

Der findes ikke standard mennesker, og derfor laver vi heller ikke standard køkkener.

Dansk design og produktion

Alle vores køkkener er designet i Danmark og produceret på vores fabrik i Ølgod.

Over 40 års erfaring

Vi har over 40 års erfaring og mere end 450.000 personlige køkkener i baggagen.

Skal drømmen realiseres?

Få svar på dine spørgsmål, inspiration og rådgivning. Du får et uforpligtende tilbud og en gratis 3D-visualisering.
Book et designmøde

{{topMenuItem.Name}}

Cookie-liste · Cookies og persondata · Admin store page