Art Deco – Roaring Twenties
The design style 'Art Deco' arose between the 1920s and the 1930s in furniture, decorative arts and architecture. The style was characterised by its geometric forms. While the design language was following functionalistic approaches, it also intentionally beautified simplistic objects. The term is based on the exhibition Exposition Internationale des Arts Décoratifs et Industriels Modernes which took place in 1925 in Paris. During the exhibition, craftsmen demonstrated their creation which had common modern features. The aesthetic arrows out of a combination of the artistic Art Nouveau and straightforward cubism. The geometric character was, hence, influenced by sinuous curves derived from plant forms. Embracing the future in all its man-made and machine-driven glory was the primary goal of Art Deco. This aim is reflected in the exaggerated glamourousness.
Key Characteristics
The main characteristics of the Art Deco theme:
Metals
One of the most important aspects of Art Deco was the celebration of metals. After all, new materials were essential for constructing the embraced future. The materials were, thus, emphasized in art or in architecture. The Art Deco theme quotes this design aspect with a shimmery gold effect. This special is applied to borders, decoration, and also URLs. The look was achieved by applying a linear gradient on elements.
See how the gold effect is created:
h1 {
background: -webkit-linear-gradient(#BF953F, #FCF6BA, #FBF5B7, #AA771C);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-family: "parklane";
font-size: 3vh;
margin: 0;
padding: 0 0 0 0;
line-height: normal;
}
Shapes
With Art Deco, a certain the degree of soberness entered a flourishing art scene. This soberness, however, was of his own character. The floristic shapes of Art Nouveau were revisited and merged with the geometric reduction which Cubism aimed to master. The resulting shapes were in their own way complex and simplistic. At last, the forms were still pure decoration. In the theme, the look was achieved by using the pseudoclass ':before' and ':after', with which the insertion of images became possible without changing the HTML files.
header {
width: 80vw;
margin: 8vmin auto;
text-align: center;
}
header:before {
content: "";
display: inline-block;
background-image: url("../../img/divider/divider-6.svg");
background-blend-mode: multiply;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
width: 60vw;
margin: 0;
padding: 0;
padding-top: 25vmax;
}
header:after {
content: "";
display: inline-block;
background-image: url("../../img/divider/divider-9.svg");
background-repeat: no-repeat;
background-position: center;
background-size: contain;
width: 60vw;
margin: 0;
padding: 0;
padding-top: 13.5vmax;
}
Colours
The Art Deco colour palette exists in two sets which cover two aspects of the period: bold and bright, and neutral and streamlined. The first refers to energetic and lively colours which are inspired by the prosperity of the roaring twenties. The later, however, embodies the before mentioned wealth which is represented with valuable metals. Those metallic colours were combined with neutrals, monochromatic colours which served to achieve a streamlined, modern look. For the theme, all those aspects were channelled and combined in the royal blue velvet background and the polished gold.
html {
background-image: url("../../img/bg/velvet.png");
background-repeat: repeat;
height: 100vh;
width: 100vw;
margin: 0;
padding: 0;
}
Fonts
While Art Deco was often highly decorative, practitioners were devoted to creating functional design. This is reflected in the fonts which the zeitgeist brought forth: the collection ranges from ornated to rectilinear fonts. This variety is reflected in the Art Deco theme by an ornamental font for headings and an easily readable type for the body.
@import url('https://fonts.googleapis.com/css?family=Poiret+One');
@font-face {
font-family: parklane;
src: url("../../fonts/artDeco/parklane.otf") format("opentype");
}
body {
font-family: "Poiret One", cursive;
color: #fff;
height: 100vh;
width: 100vw;
margin: 0;
padding: 0;
}
header > p {
text-align: center;
background: -webkit-linear-gradient(#BF953F, #FCF6BA, #FBF5B7, #AA771C);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-family: "parklane";
font-size: 1rem;
}
SOURCES
The Ultimate Guide to Art Deco by Marta www.artdecostyle.ca
Divider Collection – Art Deco Style by Freepik www.freepik.com
What is Art Deco? by Artsy www.artsy.net
Art Terms: Art Deco by Tate Modern www.tate.org
