# Errors

Errors in Magic aren't really errors. They are the equivalent of what other frameworks call 'alerts' or 'notifications'.

## Introduction

Alerts/errors/notifications are a simple and straight-forward way of conveying the status of a request. For example, they can be used to tell the user that his/her login details were incorrect, or that their transaction has been successfully processed.

In Magic, an error looks like this:

I am a 'problem' error!

## Adding errors

To add a simple error in Magic:

Unfinished error

    <div class="error">Unfinished error</div>

This error is incomplete, as it has no colour property. To complete it, we need to add colour.

### Adding colours

Magic errors have their own three colours, specifically designed to match them:

Problem error
Success error
Info error

    <div class="error problem">Problem error</div>
    <div class="error success">Success error</div>
    <div class="error info">Info error</div>

Despite this, you can style errors by adding a Magic Colour class (including gradients):

Blue Darken-1
Gradient Green

    <div class="error blue-darken-1">Blue Darken-1</div>
    <div class="error gradient-green">Gradient Green</div>