In my 2019 year wrap up, I hinted at new content that will be taking place on my personal site. So without further ado I like to present my CSS IMAGE monthly challenge. For those who have previewed my CodePen profile, you will already know that I really enjoy creating what is known as a CSS Image where all of the image is created using only HTML and CSS (or other provided programming languages).
So here is the rules:
- Each month I have to publish a new pen
- CSS image must be based on a randomized theme of the month (January Theme: Time)
- All CSS images must include animation
Very simple but I think we are gonna see a awesome collection by the end of the year. If you create your own CSS Images be sure to share them with me.
January CSS Image – Time
See the Pen Time (CSS Image) – January by Kayla Wiest (@sakoi_) on CodePen.
This months theme is Time and it took me a while to figure out what type of inspiration to do but then I stumbled upon a screenshot from a video game call Bravely Default (If you like turn based JRPGs, I highly recommend).
Taking influence from the image I recreate a clock face that used colors to create depth in the gears (darker is closer, lighter is farther). All in all, another successful build and looking forward to next months challenge.
