<style>
    div { font-family: WebKit WeightWatcher; font-size: 48px; }
    .w1 { font-weight: 100; }
    .w2 { font-weight: 200; }
    .w3 { font-weight: 300; }
    .w4 { font-weight: 400; }
    .w5 { font-weight: 500; }
    .w6 { font-weight: 600; }
    .w7 { font-weight: 700; }
    .w8 { font-weight: 800; }
    .w9 { font-weight: 900; }
</style>
<p>
    You should see the numbers 1 to 9 below.
</p>
<div class="w1">
    A
</div>
<div class="w2">
    A
</div>
<div class="w3">
    A
</div>
<div class="w4">
    A
</div>
<div class="w5">
    A
</div>
<div class="w6">
    A
</div>
<div class="w7">
    A
</div>
<div class="w8">
    A
</div>
<div class="w9">
    A
</div>