1
0
Fork 0
mirror of https://github.com/adobe-fonts/source-sans.git synced 2025-09-07 12:41:45 +02:00
adobe-source-sans/docs/index.html
2020-11-11 14:26:47 +01:00

415 lines
19 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<meta name="format-detection" content="telephone=no">
<title>Source Sans 3</title>
<link rel="stylesheet" href="source-sans-3.css">
<style>
body {
font-family: 'Source Sans 3 VF', 'Source Sans 3', sans;
overflow-x: hidden;
font-feature-settings: "kern" 1,"liga" 1;
font-size: 100%;
}
article {
margin: 0 auto;
max-width: 900px;
padding: 1em;
}
h1 {
font-size: 56px;
margin: 0;
}
h2 {
color: #AAA ;
margin-top: 0.75em;
margin-bottom: 0;
}
div {
font-size: 40px;
padding: 0.5em 0.75em;
margin: 0;
outline: 0px solid transparent;
autocorrect: "off";
overflow: hidden;
hyphens: off;
}
p {
margin: 0;
padding-bottom: .5em;
}
div:hover
{
background-color: #EEE;
}
.ribbon {
width: 12.1em;
height: 12.1em;
position: absolute;
overflow: hidden;
top: 0;
right: 0;
z-index: 9999;
pointer-events: none;
font-size: 13px;
text-decoration: none;
text-indent: -999999px;
}
.ribbon:before, .ribbon:after {
position: absolute;
display: block;
width: 15.38em;
height: 1.54em;
top: 3.23em;
right: -3.23em;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.ribbon:before {
content: "";
padding: .38em 0;
background-color: rgb(34, 34, 34);
pointer-events: auto;
}
.ribbon:after {
content: attr(data-ribbon);
color: #fff;
font: 700 13px 'Source Sans 3 VF', 'Source Sans 3';
line-height: 1.54em;
text-decoration: none;
text-align: center;
text-indent: 0;
padding: .15em 0;
margin: .15em 0;
}
@media (max-width: 720px) {
h1 {
font-size: 36px;
}
h2 {
font-size: 18px;
}
div {
padding: 0;
font-size: 18px;
}
}
@media (min-width: 1200px) {
h1 {
font-size: 72px;
}
h2 {
font-size: 32px;
}
div {
font-size: 50px;
}
article {
max-width: 1100px;
}
}
@media (prefers-color-scheme: dark) {
body {
background-color: #222;
color: #FFF;
}
div:hover
{
background-color: #333;
}
.ribbon:before {
background-color: rgb(221, 221, 221);;
}
.ribbon:after {
color: #000;
}
@media (prefers-color-scheme: light) {
body {
background-color: #FFF;
color: #000;
}
div:hover
{
background-color: #EEE;
}
}
</style>
</head>
<body>
<article spellcheck="false">
<h1>Source Sans 3</h1>
<hr>
<h2 style="font-weight: 200;">ExtraLight</h2>
<div contenteditable style="font-weight: 200;">
<p>
Parciais fy jac codi baw hud <br>llawn dŵr ger tŷ Mabon.<br><!-- Welsh -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Ξεσκεπάζω την ψυχοφθόρα βδελυγμία.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
У рудога вераб’я ў сховішчы пад <br>фатэлем ляжаць нейкія гаючыя зёлкі.<br><!-- Byelarussian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 200; font-style: italic;">ExtraLight Italic</h2>
<div contenteditable style="font-weight: 200; font-style: italic;">
<p>
Muļķa hipiji mēģina brīvi <br>nogaršot celofāna žņaudzējčūsku.<br><!-- Latvian -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Θα ξεφύγω με βία στην ψυχεδελική πρόζα.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
<span lang="bg">Под южно дърво, цъфтящо в синьо, <br>бягаше малко пухкаво зайче.<br><!-- Bulgarian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ</span><br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 300;">Light</h2>
<div contenteditable style="font-weight: 300;">
<p>
Þú dazt á hnéð í vök og yfir <br>blóm sexý pæju.<br><!-- Icelandic -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Ταχίστη αλώπηξ βαφής ψημένη γη,<br>δρασκελίζει υπέρ νωθρού κυνός.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
<span lang="sr">Љубазни фењерџија чађавог <br>лица хоће да ми покаже штос.<br><!-- Serbian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ</span><br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 300; font-style: italic;">Light Italic</h2>
<div contenteditable style="font-weight: 300; font-style: italic;">
<p>
Loď čeří kýlem tůň obzvlášť <br>v Grónské úžině.<br><!-- Czech -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Φθηνό μπλε βράδυ, στο Γκάζι ξεψυχώ.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
<span lang="mk">Бучниов жолт џин ѕида куќа со фурна <br>меѓу полиња за цреши, хмељ и грозје.<br><!-- Macedonaian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ</span><br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 400;">Regular</h2>
<div contenteditable style="font-weight: 400;">
<p>
Viewing quizzical abstracts <br>mixed up hefty jocks.<br><!-- English -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Ζαφείρι δέξου πάγκαλο,<br>βαθῶν ψυχῆς τὸ σῆμα.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Съешь же ещё этих мягких <br>французских булок, да выпей чаю.<br><!-- Russian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 400; font-style: italic;">Italic</h2>
<div contenteditable style="font-weight: 400; font-style: italic;">
<p>
Voix ambiguë dun cœur qui au <br>zéphyr préfère les jattes de kiwi.<br><!-- French -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Βυθίζετε ψηφιακό εξοπλισμό εγχόρδων.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Ъӷай сёоң беʼсь хай дит <br>долин қаддак ақтам.<br><!-- Ket -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 600;">Semibold</h2>
<div contenteditable style="font-weight: 600;">
<p>
Victor jagt zwölf Boxkämpfer <br>quer über den großen Sylter Deich.<br><!-- German -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Διαφυλάξτε γενικά τη ζωή σας <br>από βαθειά ψυχικά τραύματα.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
<span lang="bg">Гномът Доцьо приключи спящ <br>в шейна за жаби.<br><!-- Bulgarian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ</span><br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 600; font-style: italic;">Semibold Italic</h2>
<div contenteditable style="font-weight: 600; font-style: italic;">
<p>
Jovencillo emponzoñado de <br>whisky: ¡qué figurota exhibe!<br><!-- Spanish -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Γκόλφω, βάδιζε μπροστά ξανθή ψυχή!<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Щастям бʼєш жук їх глицю <br>в фон й ґедзь пріч.<br><!-- Byelarussian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 700;">Bold</h2>
<div contenteditable style="font-weight: 700;">
<p>
Flygande bäckasiner söka <br>hwila på mjuka tuvor.<br><!-- Swedish -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Αβρός δ’εν προχοαίς κύκλωψ <br>φθογγάζετο μύρμηξ.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Чуєш їх, доцю, га? Кумедна ж ти,<br>прощайся без ґольфів!<br><!-- Ukrainian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 700; font-style: italic;">Bold Italic</h2>
<div contenteditable style="font-weight: 700; font-style: italic;">
<p>
Fahiş bluz güvencesi yağdırma <br>projesi çöktü.<br><!-- Turkish -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Βράζω γόπες με το φθηνό λάδι και ξεψυχώ.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Бүгінде чау-чауды үй <br>жануары ретінде ұстайды.<br><!-- Kazakh -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 900;">Black</h2>
<div contenteditable style="font-weight: 900;">
<p>
Jeżu klątw, spłódź Finom <br>część gry hańb!<br><!-- Polish -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Γαζίες και μυρτιές δεν θα βρω <br>πια στο χρυσαφί ξέφωτο.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
Щётканы фермд пийшин цувъя. <br>Бөгж зогсч хэльюү.<br><!-- Mongolian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<hr>
<h2 style="font-weight: 900; font-style: italic;">Black Italic</h2>
<div contenteditable style="font-weight: 900; font-style: italic;">
<p>
In quel campo si trovan funghi <br>in abbondanza.<br><!-- Italian -->
abcdefghijklmnopqrstuvwxyz<br>
ABCDEFGHIJKLMNOPQRSTU<br>
VWXYZ & 1234567890 .,:;… ¡!¿?<br>
Φθηνό μπλε βράδυ, στο Γκάζι ξεψυχώ.<br>
ΑΒΓΔΕΖΗΘΙΚΛΜΝΞΟΠΡΣΤΥΦΧΨΩ<br>
αβγδεζηθικλμνξοπρσςτυφχψω<br>
У рудога вераб’я ў сховішчы пад <br>фатэлем ляжаць нейкія гаючыя зёлкі.<br><!-- Byelarussian -->
абвгґдђѓеёєжнњопрс<!--с́--><br>тћќуўuфхцчџшщъыьэюя<br>
АБВГҐДЂЃЕЁЄЖНЊОПРС<!--С́--><br>ТЋЌУЎUФХЦЧЏШЩЪЫЬЭЮЯ<br>
'" “” ‚„′″‹› «» ()[]{}/|\ * †‡ § @ ¶<br>
$£¥€¢ƒ₹₺₽ %‰ ¼½¾⅓⅔⅛⅜⅝<br>
+−×÷∙=<>≤≥±^≠~≈¬ #π∞µ∂∫√<br>
←↖↑↗→↘↓↙▲▶▼◀△▷▽◁ ☑✓ ♪
</p>
</div>
<a class="ribbon" href="https://github.com/adobe-fonts/source-sans-3" data-ribbon="Fork me on GitHub"
title="Fork me on GitHub"
></a>
</article>
</body>
</html>