<div class="body">
  <div class="outline circle center-text mb">
    Go!
  </div>
  <div class="outline center-text">
    Go!
  </div>
</div>
.body {
  width: 100%;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.outline {
  background: rgb(75, 75,200);
        background: -webkit-radial-gradient(50% 50%, circle, rgb(75, 75, 200), rgb(0, 0, 75));
        background:     -moz-radial-gradient(50% 50%, circle, rgb(75, 75, 200), rgb(0, 0, 75));
        background:         -ms-radial-gradient(50% 50%, circle, rgb(75, 75, 200), rgb(0, 0, 75));
        background:             -o-radial-gradient(50% 50%, circle, rgb(75, 75, 200), rgb(0, 0, 75));
        background:                 radial-gradient(circle at 20% 70%, rgb(75, 75, 200), rgb(0, 0, 75));
  border: 1px solid #000;
  width: 100px;
  height: 100px;
}

.circle {
  border-radius: 50%;
    }

.center-text {
  color: #000;
  font: bold 16px/6em "Helvetica Neue", sans-serif;
  text-align: center;
}

.mb {
  margin-bottom: 8px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.