CSS Battle #140 - Eclipse

0 %
Manoj Kumar
Freelance Web Developer
"One Is All, All Is One"
  • City:
    Chennai
  • Country:
    India
  • Age:
    27
Lifetime score board
Shows
Music
Games
Current Interest Levels
Web Development
Cricket
Chess
Fitness
Movies & TV Series
Cooking
Trading
Cybersecurity
  • Ambivert
  • Nocturnal
  • Gym Junkie
  • Tech Enthusiast
  • Teetotalism

#140 – Eclipse

December 21, 2022

Let’s start with creating a full moon on a blue sky.

We can create another circle of the color blue and place it below so that it covers some portion of the full moon.

Instead of a triangle, we can create a rotated rectangle using transform: rotate() which does the same job.

The slightest of edges are visible but the rendering engine ignores it to award us fully.

Posted in CSS Battle
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x