2026-08-02-jollof-sunday-special-a-bowl-of-jollof-rice-in-pure-css-ee73e1d2b1
Jollof Rice in Pure CSS
DEV Community
EDITOR BRIEF
This CSS art piece recreates a bowl of jollof rice with plantain, a boiled egg, and a pepper, all without images or SVG assets. The artist says the rice texture, plate speckles, and fried edges are made with layered gradients and box shadows, while the steam uses blurred circles animated on different delays. They also reflect that CSS texture can come from stacking small gradients at different sizes and opacity.
INSIGHTS
This is a good example of how basic CSS tools can create realistic visuals. A useful next step is to experiment with radial gradients and keyframe animations to make your own food art or simple motion effects.
COMMENTS
Loading comments…