Stat columns

← All examples

~3kbgzipped
0dependencies
2slots
~80CSS variables

Code

<style>
.stat-columns {
  --steam-block-media-width: 0;
  --steam-block-media-min-width: 0;
  --steam-block-content-display: grid;
  --steam-block-content-grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  --steam-block-content-gap: 1.5rem;
  --steam-block-padding: 3rem 2rem;
  --steam-block-content-text-align: center;
  --steam-block-background: #003049;
  --steam-block-border-radius: 1rem;
}
</style>
<steam-block class="stat-columns">
  <div slot="content"><strong>~3kb</strong><span>gzipped</span></div>
  <div slot="content"><strong>0</strong><span>dependencies</span></div>
  <div slot="content"><strong>2</strong><span>slots</span></div>
  <div slot="content"><strong>~90</strong><span>CSS variables</span></div>
</steam-block>