0:00 The next style variant we're going to implement is a tone prop. Take these three buttons that suggest different tones for our modal. This is the default tone. For now, they all are using this default tone.

0:11 What we want them to look like, is like so. The default tone is as it is now. The danger tone has this red tint. The success tone has this green. You can probably recognize the buttons that we have built in the previous section. Our modal component has now one more prop added to the prop types.

0:30 You can see the tone prop using the ButtonProps ['tone'] . We're not listing manually the different values like we do for the size, but we're grabbing the tone props that we had on our buttons previously, which are "default", "danger", and "success". You can see at the top of the file here we're importing this ButtonProps from the button component.

0:49 Your job is to populate this new toneClasses object. You know the drill. You need to figure out what you should be styling with this toneClasses object and then go and implement it. Good luck.