Onboarding template

You can use this template to build an onboarding flow to showcase your app features and provide context for users.

With App Name you can easily sync all of your things with your Miro boards!

Skip

html

<div class="grid">
  <div class="cs2 ce11">
    <img class="message-graphic" src="/onboarding.svg" />
  </div>
  <div class="cs1 ce12 message-text">
    <p class="p-large">With App Name you can easily sync all of your things with your Miro boards!</p>
  </div>
  <div class="cs1 ce12 message-buttons">
    <button class="button-icon icon-arrow-left" disabled type="button"></button>
    <button class="button-icon icon-arrow-right" type="button"></button>
  </div>
  <div class="cs1 ce12 centered">
    <a href="#" class="link">Skip</a>
  </div>
</div>

css

.message-graphic {
  margin-block: var(--space-medium)
}
.message-buttons {
  display: flex;
  justify-content: center;
}
.message-text {
  text-align: center;
}