reactstrap - Colors

Colors

Convey meaning through color with a handful of emphasis utility classes. These may also be applied to links and will darken on hover just like our default link styles.

Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.

Nullam id dolor id nibh ultricies vehicula ut id elit.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula.

Maecenas sed diam eget risus varius blandit sit amet non magna.

Etiam porta sem malesuada magna mollis euismod.

Donec ullamcorper nulla non metus auctor fringilla.

Etiam porta sem malesuada ultricies vehicula.

import React from 'react';

const Example = () => {
  return (
    <div>
      <p className="text-muted">Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>
      <p className="text-primary">Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
      <p className="text-success">Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
      <p className="text-info">Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
      <p className="text-warning">Etiam porta sem malesuada magna mollis euismod.</p>
      <p className="text-danger">Donec ullamcorper nulla non metus auctor fringilla.</p>
      <p className="text-white">Etiam porta sem malesuada ultricies vehicula.</p>
    </div>
  );
};

export default Example;

Utilities