<figure class="chartlet-figure"><figcaption>Quarterly change</figcaption><svg xmlns="http://www.w3.org/2000/svg" width="800" height="450" viewBox="0 0 800 450" role="img" aria-labelledby="chartlet-7444a2bb2f12ed0b-title chartlet-7444a2bb2f12ed0b-description" class="chartlet-root"><title id="chartlet-7444a2bb2f12ed0b-title">Quarterly change</title><desc id="chartlet-7444a2bb2f12ed0b-description">Bar chart with 4 categories. Highest: 15% (Fourth quarter). Lowest: -4% (Second quarter).</desc><style>.chartlet-root{max-width:100%;height:auto;font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#172033}.chartlet-title{font-size:22px;font-weight:650;fill:#172033}.chartlet-label,.chartlet-tick,.chartlet-value,.chartlet-value-inverse,.chartlet-axis-title{font-size:12px;fill:#344054}.chartlet-value,.chartlet-value-inverse{font-weight:600}.chartlet-value{fill:#172033}.chartlet-value-inverse{fill:#fff}.chartlet-axis-title{font-weight:600}.chartlet-grid{stroke:#d9dee8;stroke-width:1}.chartlet-zero{stroke:#667085;stroke-width:1.5}.chartlet-bar,.chartlet-point{fill:#2563eb}.chartlet-line{fill:none;stroke:#2563eb;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}</style><text x="210" y="30" text-anchor="start" class="chartlet-title">Quarterly change</text><line x1="210" y1="78" x2="210" y2="394" class="chartlet-grid"/><text x="210" y="416" text-anchor="middle" class="chartlet-tick">-5%</text><line x1="340.5" y1="78" x2="340.5" y2="394" class="chartlet-zero"/><text x="340.5" y="416" text-anchor="middle" class="chartlet-tick">0%</text><line x1="471" y1="78" x2="471" y2="394" class="chartlet-grid"/><text x="471" y="416" text-anchor="middle" class="chartlet-tick">5%</text><line x1="601.5" y1="78" x2="601.5" y2="394" class="chartlet-grid"/><text x="601.5" y="416" text-anchor="middle" class="chartlet-tick">10%</text><line x1="732" y1="78" x2="732" y2="394" class="chartlet-grid"/><text x="732" y="416" text-anchor="middle" class="chartlet-tick">15%</text><text x="471" y="438" text-anchor="middle" class="chartlet-axis-title">Change</text><text x="198" y="58" text-anchor="end" class="chartlet-axis-title">Quarter</text><rect x="340.5" y="92.22" width="313.2" height="50.56" class="chartlet-bar"><title>First quarter: 12%</title></rect><text x="661.7" y="121.5" text-anchor="start" class="chartlet-value">12%</text><text x="198" y="121.5" text-anchor="end" class="chartlet-label">First quarter</text><rect x="236.1" y="171.22" width="104.4" height="50.56" class="chartlet-bar"><title>Second quarter: -4%</title></rect><text x="244.1" y="200.5" text-anchor="start" class="chartlet-value-inverse">-4%</text><text x="198" y="200.5" text-anchor="end" class="chartlet-label">Second quarter</text><rect x="340.5" y="250.22" width="208.8" height="50.56" class="chartlet-bar"><title>Third quarter with a deliberately long label: 8%</title></rect><text x="557.3" y="279.5" text-anchor="start" class="chartlet-value">8%</text><text x="198" y="279.5" text-anchor="end" class="chartlet-label">Third quarter with a deliber…</text><rect x="340.5" y="329.22" width="391.5" height="50.56" class="chartlet-bar"><title>Fourth quarter: 15%</title></rect><text x="740" y="358.5" text-anchor="start" class="chartlet-value">15%</text><text x="198" y="358.5" text-anchor="end" class="chartlet-label">Fourth quarter</text></svg><p class="chartlet-source">Source: Example data</p><details class="chartlet-data"><summary>Show chart data</summary><table><caption>Data for Quarterly change</caption><thead><tr><th scope="col">Category</th><th scope="col">Value</th></tr></thead><tbody><tr><th scope="row">First quarter</th><td>12%</td></tr><tr><th scope="row">Second quarter</th><td>-4%</td></tr><tr><th scope="row">Third quarter with a deliberately long label</th><td>8%</td></tr><tr><th scope="row">Fourth quarter</th><td>15%</td></tr></tbody></table></details></figure>