DEV Community

loading...
Cover image for ๐ŸŽน๐ŸŽถ I drew a vintage keyboard using only HTML & CSS

๐ŸŽน๐ŸŽถ I drew a vintage keyboard using only HTML & CSS

Sarah
(they/them). Technologist + designer. Interested in ethics, accessibility, inclusivity and AI/ML. Often having fun with css.
ใƒป1 min read

I've been making drawings like this on a semi-regular basis, it's incredibly fun and relaxing. When I came across an image of this old Casio keyboard, I just knew I had to draw it as well.

You can check out all my drawings on CodePen or GitHub.

Discussion (26)

Collapse
mikepijn profile image
Michael Pijnenburg

I was just reading dev.to/parkersoftware/is-programmi...

This solves the question

Collapse
carlosrayon profile image
Carlos Rayรณn รlvarez

Whooouuuu!!!! ๐Ÿ‘๐Ÿ‘๐Ÿ‘๐Ÿ‘๐Ÿ‘๐Ÿ‘๐Ÿ‘๐Ÿ‘

Collapse
twoshedsjackson profile image
Collapse
skribascode profile image
Jeremy

Very good job !

Collapse
fossheim profile image
Sarah Author

Thank you!

Collapse
titonobre profile image
Tito

Excelent work!
I had a Casio PT-20 some 30 year ago.

Is your work protected by some type of license? I would like to try to make it interactive and play some sounds.

Collapse
injamul profile image
Collapse
fossheim profile image
Sarah Author

Thanks ๐Ÿ˜Š

Collapse
georgedoescode profile image
George Francis

Ah sooo good!

Collapse
fossheim profile image
Sarah Author

Thank you!

Collapse
mvoloskov profile image
Collapse
mightytechno profile image
Mighty

You have a great skill. Cool one.

Collapse
fossheim profile image
Collapse
dana94 profile image
Dana Ottaviani

This looks really cool!

Collapse
devindford profile image
Devin Ford

This came out amazing!

Collapse
ltsharma profile image
Lakshmeesha

Wow!, thats amazing... So HTML & CSS is the future if graphic designing too....

Collapse
guzcode profile image
Collapse
ankityadav33 profile image
Ankit Yadav

This looks as realistic as a photograph. Great Job.

Collapse
fossheim profile image
Sarah Author

Thank you โœจ

Collapse
saswatamcode profile image
Saswata Mukherjee

This looks so cool!

Collapse
fossheim profile image
Collapse
owarup profile image
owarup

It's so amazing.
I'll try to replicate it to practice.

Collapse
fossheim profile image
Sarah Author

Thanks! Would love to see your result when you're finished โœจ

Collapse
andrewharpin profile image
Andrew Harpin

I had one as a kid

Collapse
oanaom profile image
Oana Munteanu

This looks so real! ๐Ÿ˜ฎ๐Ÿ‘

Collapse
fossheim profile image
Sarah Author

Thank you ๐Ÿ™Œ

Forem Open with the Forem app