{"id":16611,"date":"2023-06-15T10:35:14","date_gmt":"2023-06-15T08:35:14","guid":{"rendered":"https:\/\/design-guidelines.burckhardt.swiss\/elemente\/line\/"},"modified":"2023-07-20T18:17:35","modified_gmt":"2023-07-20T16:17:35","slug":"line","status":"publish","type":"post","link":"https:\/\/design-guidelines.burckhardt.swiss\/en\/basic-elements\/line\/","title":{"rendered":"Line"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n
\n
\n
\n

Linie<\/h1>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
\n
\n

Line<\/h2>\n\n\n\n
\n
\n

The line is a defining design element
of Burckhardt\u2019s corporate design. Derived from the logo, it is used in two cases: as a red underline for emphasis and as a black dividing line to mark boundaries.<\/p>\n\n\n\n

Underlining <\/h3>\n\n\n\n

To highlight individual words or groups of words within headings or quotations, these can be underlined in red. The thickness of the horizontal line of the headline font serves as the benchmark for the underlining. This line thickness defines both the thickness of the red line and the distance between the headline and the red line. <\/p>\n\n\n\n

The red line breaks around descenders. The distance between the red line and the descender corresponds to the horizontal line thickness of the headline. <\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
\n
\n
\n

Dividing line <\/h3>\n\n\n\n

Lines are also used as a separating element between headlines and body text\/introductory text. This makes the hierarchization clearer and picks up on the line in the logo in the design. <\/p>\n\n\n\n

Since it is not used here as a highlighting but as a separating element, the distance between the headline and the line is greater than with the typographic highlighting. The distance is equivalent to the cap height of the headline. The length of the dividing line is twice the cap height. <\/p>\n\n\n\n

The dividing line should not be used in the immediate vicinity of the logo to avoid duplication of the element.<\/p>\n<\/div>\n\n\n\n

\n
<\/div>\n\n\n\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
\n

Other topics<\/h2>\n\n\n\n
\n
\n

\n Logo\n <\/h3>\n \n \"\"\n <\/a>\n <\/div>\n
\n

\n Typography\n <\/h3>\n \n \"\"\n <\/a>\n <\/div>\n
\n

\n Icons\n <\/h3>\n \n \"\"\n <\/a>\n <\/div>\n <\/div>\n\n
\n \n