TYPOGRAPHY.HTML

<h1 id="typography">Typography</h1>
<p><strong>Context: <a href="../README.md">frontend-dev-bookmarks</a> / Appearance</strong></p>
<p>The style, arrangement, or appearance of typeset matter.</p>
<p><a href="http://frontend.directory/"><img src="https://img.shields.io/badge/frontend-directory-blue.svg?style=flat-square" alt="frontend.directory" /></a> <a href="https://gitter.im/dypsilon/frontend-dev-bookmarks"><img src="https://img.shields.io/gitter/room/dypsilon/frontend-dev-bookmarks.svg?style=flat-square&amp;maxAge=2592000" alt="Gitter" /></a> <a href="https://twitter.com/FrontendDir"><img src="https://img.shields.io/badge/follow-twitter-55acee.svg?style=flat-square" alt="Twitter" /></a></p>
<table style="width:58%;">
<colgroup>
<col style="width: 58%" />
</colgroup>
<tbody>
<tr class="odd">
<td>+ <strong><a href="https://www.zachleat.com/web/comprehensive-webfonts/">A Comprehensive Guide to Font Loading Strategies</a></strong>: Zach Leatherman describes different approaches to loading of web fonts. + <strong><a href="https://edgewebfonts.adobe.com/fonts">Adobe Edge Web Fonts</a></strong>: Edge Web Fonts is a free service that provides access to a large library of fonts for your website. It’s one of the Edge Tools &amp; Services from Adobe. Use of the service is free and unlimited. + <strong><a href="https://github.com/daneden/Baseline.js">Baseline.js</a></strong>: A simple jQuery plugin for restoring vertical baselines thrown off by odd image sizes. + <strong><a href="http://www.newnet-soft.com/blog/csstypography">CSS Typography cheat sheet</a></strong>: Small roundup on CSS features that will enhance your web typography. + <strong><a href="http://stackoverflow.com/questions/2892691/font-face-fonts-only-work-on-their-own-domain">Convincing a browser to load fonts from other domains</a></strong>: A StackOverflow question about loading fonts across domains. + <strong><a href="http://fittextjs.com/">FitText</a></strong>: FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element. + <strong><a href="http://simplefocus.com/flowtype/">FlowType.JS</a></strong>: Font-size and line-height based on element width. + <strong><a href="http://media.24ways.org/2007/17/fontmatrix.html">Fontmatrix</a></strong>: Matrix of fonts bundled with Mac and Windows operating systems, Microsoft Office and Adobe Creative Suite. + <strong><a href="https://www.google.com/fonts/">Google Fonts</a></strong>: Google Fonts makes it quick and easy for everyone to use web fonts. Our goal is to create a directory of web fonts for the world to use. Our API service makes it easy to add Google Fonts to a website in seconds. + <strong><a href="http://matejlatin.github.io/Gutenberg/">Gutenberg</a></strong>: Gutenberg is a flexible and simple-to-use web typography starter kit for web designers and developers. + <strong><a href="http://letteringjs.com/">Lettering.js</a></strong>: Web type is exploding all over the web but CSS currently doesn’t offer complete down-to-the-letter control. So we created a jQuery plugin to give you that control. + <strong><a href="http://open-foundry.com/">OpenFoundry</a></strong>: A platform for open-source fonts in a noise-free environment; to highlight their beauty and encourage further exploration. + <strong><a href="http://tilomitra.github.io/csstypography/">Pure Typography</a></strong>: CSS Styles for nicer web type. Depends on Pure. + <strong><a href="http://www.html5rocks.com/en/tutorials/webfonts/quick/">Quick guide to webfonts via <span class="citation" data-cites="font-face">@font-face</span></a></strong>: The <span class="citation" data-cites="font-face">@font-face</span> feature from CSS3 allows us to use custom typefaces on the web in an accessible, manipulable, and scalable way. + <strong><a href="https://www.smashingmagazine.com/2016/05/fluid-typography/">Truly Fluid Typography With vh And vw Units</a></strong>: This article describes viewport units and other technics to achieve typography which resizes smoothly with the screen. + <strong><a href="https://github.com/hudsonfoo/typebutter">TypeButter</a></strong>: TypeButter allows you to set optical kerning for any font on your website. If you’re longing for beautifully laid out text that today’ browsers just don’t provide, this is the plugin for you. + <strong><a href="https://github.com/joshuarudd/typeset.css">Typeset.css</a></strong>: A no-nonsense CSS typography reset for styling user-generated content like blog posts, comments, and forum content. + <strong><a href="http://stormwarning.github.io/typeset.css/">Typeset.css</a></strong>: A Sass library that provides some sensible default styles, optional classes to use &amp; extend as needed, and some utility functions &amp; mixins to make elevating your typography simpler. + <strong><a href="http://baconforme.com/">bacon</a></strong>: Bacon is a jQuery plugin that allows you to wrap text around a bezier curve or a line. + <strong><a href="https://github.com/freqDec/slabText/">slabText</a></strong>: A jQuery plugin for producing big, bold &amp; responsive headlines. + <strong><a href="http://jrvis.com/trunk8/">trunk8</a></strong>: trunk8 is an intelligent text truncation plugin to jQuery. When applied to a large block of text, trunk8 will cut off just enough text to prevent it from spilling over.</td>
</tr>
</tbody>
</table>
<h1 id="license">License</h1>
<p><a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" /></a><br />This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</p>
<p>Please provide a link back to this repository. This is not necessary for GitHub forks.</p>