Building an Accessible Dark-Light Toggle from a Figma Design - FEM Social Media Dashboard, Part 3
via YouTube
Learn AI, Data Science & Business — Earn Certificates That Get You Hired
Learn EDR Internals: Research & Development From The Masters
Overview
Google, IBM & Meta Certificates — All 10,000+ Courses at 40% Off
One annual plan covers every course and certificate on Coursera. 40% off for a limited time.
Get Full Access
Learn how to build and style an accessible dark/light toggle from a Figma design in this comprehensive tutorial video. Study the design, construct the top bar, implement accessible HTML markup for the toggle, and style both the top bar and toggle with accessibility in mind. Follow along as the instructor guides you through each step, from initial design analysis to final styling touches. Gain valuable insights into creating user-friendly and inclusive web interfaces while working on a practical project from Frontend Mentor's social media dashboard challenge.
Syllabus
- Intro.
- Study design.
- Building top bar.
- Using accessible markup for toggle.
- Styling the top bar.
- Styling the toggle so that it's accessible.
Taught by
Coder Coder