ValidationMessage

const Preview = () => {
  return <ValidationMessage>Dette er en valideringsmelding.</ValidationMessage>;
};

render(<Preview />)

const AllColors = () => {
  return (
    <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
      <ValidationMessage data-color='danger'>
        Dette er en feilmelding.
      </ValidationMessage>

      <ValidationMessage data-color='success'>
        Dette er en suksessmelding.
      </ValidationMessage>

      <ValidationMessage data-color='info'>
        Dette er en informasjonsmelding.
      </ValidationMessage>

      <ValidationMessage data-color='warning'>
        Dette er en advarsel.
      </ValidationMessage>
    </div>
  );
};

render(<AllColors />)