DEV Community

Cover image for πŸ”§ Code & Creativity - Crafting Accessible Forms with a Dash of CSS Magic!
Adam Marsden
Adam Marsden

Posted on

πŸ”§ Code & Creativity - Crafting Accessible Forms with a Dash of CSS Magic!

Hey everyone ✌️ Here's a quick look at this week's newsletter:

🌐 From Pixels to Paper

🌟 Typographic Alchemy

✏️ Icon Design Decoded

Enjoy this week's edition πŸ‘‹ - Adam at Unicorn Club.


The Newsletter for Unicorns πŸ¦„

5-minute bite-sized weekly newsletter for design-savvy front-end devs and code-loving UX/UI designers. Filled with the best hand-picked resources. 100% free.

Subscribe for free


Sponsored by Webflow

Accelerate your agency’s growth

Whether you need to win new business or wow an existing client, Webflow empowers agencies to deliver high-quality client work, faster β€” without growing your dev budget.

Start building β†’


πŸ¦„ This week's best

Front-End solution: progress indicator

I knew when I set this challenge, there were multiple ways to solve it and I was not disappointed by the diversity in approaches that folks kindly sent to me.

A formula for responsive font-size

This CSS is now part of most websites I make: :root { font-size: calc(1rem + 0.25vw); }

The hidden power of typography

The science behind how design choices influence perception and behavior.


🧠 Fun Fact

The Origin of "Upper" and "Lowercase" - Did you know the terms "uppercase" and "lowercase" come from the physical layout of a traditional print shop? Letters used in printing were stored in cases; capital letters were kept in the upper case while the smaller letters were stored in the lower case.


Setting And Persisting Color Scheme Preferences With CSS And A β€œTouch” Of JavaScript

There are many ways to approach a β€œDark Mode” feature that respects a user’s system color scheme preferences and allows for per-site customization.

How to design icons in Figma

Design should be democratic, that's why our team refuses to hide the process behind our art.

Accessible Forms with Pseudo Classes

I am going to take you through creating a simple contact form using semantic HTML and an awesome CSS pseudo class known as :focus-within.

From ink to pixel to ink

There’s something about the book, as an object, that managed to survive across all the various societal and technological changes.

πŸ”₯ Promoted Links

Share with 2,000+ readers, book a classified ad.

Get smarter about Tech in 5 min

Get the most important tech news, tools and insights. Join 90,000+ early adopters staying ahead of the curve, for free.

Support the newsletter

If you find Unicorn Club useful and want to support our work, here are a few ways to do that:

πŸš€ Forward to a friend

πŸ“¨ Recommend friends to subscribe

πŸ“’ Sponsor or book a classified ad

β˜•οΈ Buy me a coffee

Thanks for reading ❀️

@AdamMarsdenUK from Unicorn Club

Top comments (0)