Intro component using CSS grid, vanilla javascript, and Netlify forms

If you set type="email" for the email input element, the browser will check that the user entered a valid email address automatically. You can then use the :valid and :invalid CSS pseudo-classes to style the input accordingly.

More info here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/email.

Hope that helps!

Great work, Hannah! To keep the custom validation styling you could use Regex in your JavaScript to check for a valid email format. Here are a few possible solutions on StackOverflow. I would recommend using type="email" on the email input though, to be sure the email-specific keyboard pops up for mobile users.