GUI Challenges

There is no one way to solve interfaces challenges.
In this series, we'll be challenging ourselves and each other
to find multiple ways to solve interface challenges
and expand the diversity of our skills.

Thinking on ways to solve TOOLTIPS

In today's GUI Challenge, @AdamArgyleInk builds a tooltip with a custom element (no web component!), :has(), transforms, and logical prop...

Thinking on ways to solve FABs

In today's GUI Challenge, @AdamArgyleInk builds a couple of floating action buttons (FABs) and talks about the UX and CSS considerations ...

Thinking on ways to solve BUTTONS

In today's GUI Challenge, @AdamArgyleInk styles all the web's different button types with custom properties and :where(), for light/dark...

Thinking on ways to solve DIALOG

In today's GUI Challenge, @AdamArgyleInk shows how to visually enhance the dialog element while maintaining great accessible and internat...

Thinking on ways to solve TOASTS

In today's GUI Challenge, @AdamArgyleInk shares thinking on a way to build toasts, a non-interactive and passive component for UI to prov...

Thinking on ways to solve SWITCHES

In today's GUI challenge I share my thinking on a way to solve a switch. A tiny, UX packed component that ended up being one of the most ...

By Chrome DevRel