• 39th CSUN Assistive Technology Conference - March 18-22, 2024 at the Anaheim Marriott

    The Premier AT Conference

39th Annual CSUN Assistive Technology Conference Has Concluded

Creating and Annotating a Forced Colors Design System

Date & Time
Thursday, March 21, 2024 - 4:20 PM PDT  
Platinum 8  

In 2020 Microsoft partnered with the CSS Working Group and the Chromium project to align on web standards. allowing developers and designers to create better experiences for Windows High Contrast users.

We will explore the technical relationship between Windows High Contrast and CSS Forced Colors, and proper techniques for designers to leverage them. Topics include the CSS4 System Colors, their primary uses, the importance of foreground and background pairs, designing for component states, and when to pass through the original colors.

This provides a basis for developing a design system for common controls and components such as buttons, inputs, cards, and dropdowns while giving you the knowledge to create your own approach.

We conclude by sharing approaches for creating annotation templates in tools such as Figma, creating a default color scheme that enables easier design, clean implementation instruction, and higher quality work. Used together, these templates, will allow designers, developers, and quality engineers to share a common language and understanding while leading to a consistent user experience.

This Presentation Link is provided by the Presenter(s) and not hosted by the Center on Disabilities at CSUN. The Center on Disabilities has confirmed, as of April 18, 2024, content linked is relevant to the presentation, but has not been reviewed for accessibility nor will the Center on Disabilities attempt to remediate any accessibility issues in the linked content. Please contact the Presenter(s) with any accessibility concerns.

  • Information & Communications Technology
  • Government
  • Healthcare & Rehabilitation
  • Finance & Banking
  • Research & Development
Audience Level
Session Summary (Abstract)
Does your design system include guidelines for Forced Colors? It should! Learn the basics of Forced Colors, how to design great experiences for AT like Windows High Contrast, and how to create templates in Figma to properly annotate Forced Colors.  
Primary Topic
Secondary Topics
  • Blind/Low Vision
  • Captions & Transcription
  • Digital Accessibility
  • Web
Session Type
General Track  


  • Jesse Hausler
  • Omar Bonilla

Add to Outlook/iCal (How it works)

Back to Session List