DEV Community

divya
divya

Posted on

15 5 5 5 5

CSS Art:Watermelon

This is a submission for DEV Challenge v24.03.20, CSS Art: Favorite Snack.

Inspiration

I had to learn CSS for my job as a frontend developer but started liking it. I love being artistic with it but I am still at my beginners state.

Demo

https://codepen.io/kejriwaldivya/pen/mdgBbNV

Image description

Journey

I have been obsessed with watermelon these days, thats how I tried drawing it.I started off thinking its easy but I wont deny, I struggled a bit. I have been practicing border-radius recently, so it helped me alot to get through this challenge.Although I am still figuring out how to draw the outer watermelon shades(dark green section and light green section)
Some of the properties widly used:

border-radius:was very helpful making the shapes
box-shadow,radial-gradient: to give the shadow effect

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read full post →

Top comments (12)

Collapse
 
sh20raj profile image
Sh Raj

Awesome 😎

Collapse
 
nickytonline profile image
Nick Taylor

Nice! 🍉

BB-8 giving a thumbs up

Collapse
 
rudresh98 profile image
Rudresh

Nice one

Collapse
 
sagarde profile image
Sagar Dhende

Divya you are greate in css

Collapse
 
mince profile image
Mince

Great job

Collapse
 
rajeshroyal profile image
Rajesh Royal

nice one 👍

Collapse
 
sharmi2020 profile image
Sharmila kannan

Nice!!

Collapse
 
rayyannafees profile image
Rayyan Nafees

CSS stands with Palestine 🍉

Collapse
 
mince profile image
Mince

Tasty 😋

Collapse
 
alvaromontoro profile image
Alvaro Montoro

Nice job! It looks great 😊

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more