Hello!

Thank you for believing in the mission of Style Stage!

First, I wanted to let you know that the project is very much still ongoing. So, if you're looking for a new challenge or to maybe try out some new CSS properties - review the contributor guidelines and submit your stylesheet!

Second, you probably have noticed this newsletter has been a little quiet. Partly because submissions have been slower these days, and partly because I managed to get myself involved in some new adventures 😊

Greetings fellow CSS fans!

Thank you for joining this little initative, it’s been a big highlight of my 2020! I hope you enjoyed contributing and/or perusing the contributions. And a super big thanks to those that have shared the project! I’m really looking forward to more styles in 2021 ✨

There are now 51 styles available -

Celebrating 50 Styles with a Giveaway!

Wow - Style Stage launched July 10, and less than 6 months later we've reached 50 styles!

Thank you to everyone who has contributed and shared the project.

Hello CSSpooky Friends!

It has been fun to receive extra styles this month due to Hacktoberfest!

Those styles have also given me an opportunity to identify common errors during PR reviews. Most of the fixes I request from contributors have to do with contrast and :focus, so here are some quick tips. These are useful for any site 😉

1. If you create a "button" style, the button background needs to meet 3:1 contrast with it's surrounding background
2. Do not remove outlines on :focus without providing an alternate style (and the best route is to keep outline: 2px solid transparent to support Windows High Contrast Mode)
3. :focus needs to meet 3:1 contrast against the previous color if you are changing text color, and I would suggest meeting the other minimum criteria as proposed in WCAG 2.2
4. If you allow the browser's :focus state, ensure it isn't cut off and that it is visible against any custom background styles/imagery
5. Don't forget the .skip-link! It needs to be made visible at least on :focus
6. Meeting color contrast may not be sufficient for legibility if your text is also very narrow, or a small script/italic font - consider bumping size and/or weight

Is it just me, or is it feeling a little 👻 CSSpooky around here?

One way to get in the spirit of things is to submit your Style Stage stylesheet as one of your Hacktoberfest PRs! I’ll admit I haven’t participated before, so I wasn’t aware this was a polarizing topic - but Style Stage is intended for anyone to contribute to, and if it helps out a few folx to get a better grasp of CSS, then it’s a win even if a little spam comes through, too.

'Allo!

This week I had the honor of speaking at LondonCSS all about Style Stage. If you missed it, here's the tweet with all the relevant links.

If you haven't yet contributed, consider preparing to make your stylesheet in October to count it toward your Hacktoberfest PRs!

There are now 34 styles available - go check them out!

Greetings!

I'd like to invite you to a CSS event this week - LondonCSS - which I'll be kicking off by talking about Style Stage and modern CSS. I'm super excited to hear from speakers Adam Argyle (@argyleink) and Cassie Evans (@cassiecodes), too!

📆 Save the date - September 10

See more details and register for this free virtual event. Please help share it to your networks, thanks!

Hello all,

Going to keep it short and sweet this week with just the latest three styles.

A reminder to tag me on Twitter or DM me to share your Style Stage story!

Howdy CSS fam,

This past week I released the updated design for my portfolio site. In the process, I learned a lot about clip-path. As I tweeted, the modern web absolutely does not have to be all squares and rectangles. See the roundup for a few links about clip-path.

Last week I asked for stories about your Style Stage experiences, and Halvor William Sanden (@8yard) shared about creating his stylesheet "Sysfonts".

And Shannon Crabill who contributed Vaporware let me know: "I've flexed CSS and accessibility skills that I've forgotten I'd had."

Hello to everyone, but especially past contributors, because I have an ask of you:

If Style Stage helped you learn something, would you be willing to share about your experience? You can send me links if you’ve already written an article, or you can respond to me via Twitter DM with a summary that I can include as a quote in this newsletter and possibly on the resources page. Thanks for considering it!

Aloha CSS aficionados!

This was a big Style Stage release week with eight super fantastic new styles added!

Since the July 10 launch, the 22K+ unique visitors have viewed an average of 4 stylesheets/visit 😎

And this week we passed 300 ⭐️ on the repo and are currently sitting at 37 forks, which means ~13 stylesheets may be in progress!

Happy CSSSunday everyone!

Thanks to all who have appreciated StyleStage.dev for what it is: a playground to boost your CSS skills 🌠

Those skills are transferable whether you use a utility framework, are bound to a design system, or always roll your own. It's hugely beneficial to know how CSS works under the hood so you can make changes based on client expectations and user needs, and to ensure accessibility of your styles.

A large part of my career involved developing marketing websites, and now I lead dev of a design system, so I appreciate the many valid ways CSS enters a project. My marketing days were heavily reliant on Bootstrap, and now I manage both a Sass framework and (gasp) a CSS-in-JS implementation for our React lib. But for my own projects, I prefer using Sass in a maintanable but lean-as-possible way with a mix of BEM-style classes and element styles.

Hello fellow CSS aficionados!

Welcome to the inaugural Style Stage newsletter 🎉

Thank you for supporting this project! ⭐️ Over 150 of you have starred the repo ⭐️, 12K+ have visited, and I am overall so blown away by the response to Style Stage especially in such a short period of time.

There are now 11 styles available - go check them out!