About CSS Battle
CSS Battle is a site of CSS challenges where you recreate a target image using as little code as possible. It offers daily targets, live battles and shape and layout puzzles.
What it does
Each challenge shows an image, and you write CSS that draws it. Your score depends on the length of your code, so shorter solutions rank higher. New daily targets appear each day, and you can play them at your own pace. Live battles let you compete with other players in real time. The site also shows recent record changes on its challenges.
Key features
- Daily CSS targets to recreate
- Score based on the length of your code
- Live multiplayer battles
- Shape and layout challenges
- Learn CSS section with guides
Who it's for
CSS Battle suits front-end developers who want to practise CSS in a playful way. It is also useful for designers who work with layout and shapes in code.
Pricing and good to know
The site is free to play, and you can sign in or sign up to take part. Code golf style scoring rewards tight, clever code, which may differ from everyday production code. Live battles depend on a stable connection. Use the daily targets to practise, and keep the battles for fun and comparison.
Highlights
- Daily CSS targets to recreate
- Score based on the length of your code
- Live multiplayer battles against other players
- Shape and layout challenges
- Learn CSS section with guides
