.nopara
.variables
blog          Around Austin
blog.desc     The view from downtown

viewbox.wide  550
viewbox.high  90

rect.wide     550
rect.high     90
rect.fill     blue

title.font    bold 58px sans-serif
title.fill    white
title.xoff    280
title.yoff    55

subtitle.font italic 24px sans-serif
subtitle.fill lightblue
subtitle.xoff 280
subtitle.yoff 80
.end

<svg width=$viewbox.wide height=$viewbox.high 
     viewBox="0 0 $viewbox.wide $viewbox.high" 
     xmlns="http://www.w3.org/2000/svg">
  <style>
    .subtitle { font: $subtitle.font; fill: $subtitle.fill }
    .title    { font: $title.font; fill: $title.fill }
  </style>

<rect x="0" y="0" rx="10" ry="10" width="$rect.wide" height="$rect.high" fill="$rect.fill"/>

<text text-anchor="middle" x=$title.xoff y=$title.yoff class=title>$blog</text>
<text text-anchor="middle" x=$subtitle.xoff y=$subtitle.yoff class=subtitle>$blog.desc</text>
</svg>
<br>
Here we are