The trend of coding impressive cascading style sheets shows no signs of stopping in the year 2020. Just when we thought nothing would top the amazing and life-like CSS paintings of Diana Adrianne Smith, whose 2018 "Francine" portrait is still cited as the epitome of CSS art, we are amazed by the work of other coders who see no limits when it comes to their projects. Mandy Michael is a front-end developer from Australia whose Codepen projects often cause a stir in the CSS community, and this is certainly the case with her 3D paper folding text.
Decorative type always serves a good purpose, but only if it is actually text. Making images or scalable vector graphics is not the same because you want to encourage visitors to copy and paste as needed. With the right CSS coding and attributes, Mandy Michael has been able to make text, characters, and even emojis look like they are made of paper that has been folded in a half.
What is interesting about this text effect, aside from the fact that is very cool, is that we seem to be returning to the era of skeuomorphic design, and this is certainly a good thing for those who are proficient with CSS. In essence, skeuomorphism is a school of digital design that calls for making elements appear as approximations of real-life objects. User interfaces strictly adhered to this design style since before the Windows and Macintosh operating systems, but this changed after Steve Jobs passed away and Apple designer Johnathan Ive decided to go in another direction.
The basic geometric shapes that Microsoft preferred for its Metro design language did away with skeuomorphism around 2006. Apple and Google quickly followed suit, but things are changing again because users seem to enjoy seeing digital representation of legacy objects. For hardcore CSS coders, skeuomorphism presents a challenge that they are pleased to undertake for the benefit of users.
You can find this 3D paper fold and other text effects projects on Codepen by searching MandyMichael. You will find Christmas candy, snow globe, 1980s, and vintage effects all done in CSS. For more information click here https://codepen.io/mandymichael/pen/BWyYYP.