Cascading style sheets were originally seen as useful merely for applying various pre-defined sets of style-related syntax to attached HTML documents so that multiple sections of a web page can inherit the same aesthetic theme without having to redundantly feature the same definitions throughout its source code. In recent years, however, CSS has been embraced as a language that is capable of expressing vector-based graphics and even animations without the strict involvement of externally loaded files. It is not plausible to create intricate CSS-based visuals without the use of applications that essentially act like image-creation programs that subsequently convert the results into CSS syntax. Nonetheless, the images and animations that can be created will be directly rendered by the viewer's browser and will not take long to load.
Depending on the subject matter, an image created in CSS can resemble a real-world object so closely that it can be described as photorealistic. As this interactive project posted on codepen.io demonstrates, CSS can be used to create shapes arranged as an iconic Lego figure and define gradients that provide a very convincing illusion that resembles the familiar contours of a Lego figure's individual piece shapes.