How would you improve this warning modal and add some red or yellow color to it?

This page summarizes the projects mentioned and recommended in the original post on /r/css

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • a11y-dialog

    A very lightweight and flexible accessible modal dialog script.

  • If it's a warning it should probably be role="alertdialog" rather than role="dialog". This will allow assistive devices to prioritize its content and trigger things like an alert sound. You probably also want to put keyboard focus on the least destructive action, which in your case would be the "save changes" button, rather than leaving keyboard focus above the close button. Here's a script by Kitty Giraudel that will do most of this for you, if you want.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts