Thinking on ways to solve ADAPTIVE TYPOGRAPHY
Channel:
Subscribers:
792,000
Published on ● Video Link: https://www.youtube.com/watch?v=8B7xOgp5Aow
288In today's GUI Challenge, @AdamArgyleInk shows how to use the prefers-contrast media query to adapt fonts to users contrast preferences. Contrast is about more than just color!
Chapters:
0:00 - Introduction
0:42 - prefers-contrast Support
1:36 - Simple build
3:02 - Niche design adjustment
4:05 - Advanced build (variable font)
8:35 - Review
Resources:
Try a demo → https://goo.gle/47s5Z7P
Get the source → https://goo.gle/45sk9Ea
Check out → https://goo.gle/3scBNgH
Watch more GUI Challenges → https://goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs
#GUIchallenges
Other Videos By Chrome for Developers
| 2023-08-31 | Snippets and live expressions - DevTools Tips |
| 2023-08-30 | Why do I have layout shift? |
| 2023-08-28 | DevTools - CSS Podcast Shorts |
| 2023-08-25 | Why is my image distorted? |
| 2023-08-24 | localStorage and sessionStorage |
| 2023-08-23 | Scroll-driven animations |
| 2023-08-21 | Image tips - CSS Podcast Shorts |
| 2023-08-18 | Privacy Sandbox: Noise Lab |
| 2023-08-17 | Debug CSS cascade order with DevTools |
| 2023-08-16 | Why is it overflowing? |
| 2023-08-16 | Thinking on ways to solve ADAPTIVE TYPOGRAPHY |
| 2023-08-15 | New in Chrome 116: Document Picture-in-Picture API, notRestoredReasons property, and more! |
| 2023-08-14 | What's your trick for remembering margin collapse? |
| 2023-08-11 | Layout techniques: Definitely centered layout |
| 2023-08-10 | DevTools Device Mode |
| 2023-08-09 | Why isn't the margin applying? |
| 2023-08-07 | What's the largest z-index value? |
| 2023-08-01 | Topics API - New in Chrome 115 |
| 2023-08-01 | Progressive Web Apps (PWAs): Web apps beyond the browser |
| 2023-08-01 | Chrome extension manifest V2-V3 migration |
| 2023-08-01 | Chrome as an independent app on ChromeOS |
Tags:
Chrome
Developers
Google
Web
Adaptive typography
what is adaptive typography
how to use adaptive typograph
introduction to adaptive typography
intro to adaptive typography
gui challenges
css
css tutorial
how to use css
what is css
intro to css
introduction to css
chrome developer
chrome developers
google chrome developer
google chrome developers
developer
developers
google chrome
chrome
google
chrome latest
chrome updates
Adam Argyle