Js type master

A curated collection of javascript resources about web typography

• General
  • Typography.js
  • Font.js
  • Typesetter.js
  • typogr.js
  • Calzone
• Hypenation:
  • TeX line breaking algorithm in JavaScript.
  • Hypher
  • BalanceText
• Widows:
  • The Widow Tamer
  • typorphanage
• Ellipsis:
  • trunk8
  • Ellipsis
  • Clamp.js
  • jQuery.dotdotdot
  • TextTailor.js
• Wrap around:
  • jQSlickWrap
  • Bacon!
• Kerning
  • kern.js
  • jKerny
  • TypeButter
  • Kerning.js
• Vertical rhythm
  • Auto line-height
  • Line In Typography
  • jMetronome
  • Baseline.js
• Fitting Text
  • FitText.js
  • jSlabify
  • BigText
  • Hatchshow
  • Slabtext
  • TextTailor.js
  • jQuery responsiveText
  • textFit v2.1.0
  • Squishy.js
  • jQuery TextFill
  • WideText
  • textStretch.js
  • Font-to-Width
  • Fitter Happier Text
• Responsive
  • Responsive-Measure
  • jQuery.responsiveText
  • FlowType.JS
  • jQuery.fontFlex
• Individual Letter Control
  • Lettering.js
• Special Effects
  • Web Typography for the Lonely
  • Arctext.js
  • TextGrad jQuery plugin
  • Textualizer
  • jQisotext
  • Airport
  • grab bag
  • Creative web typography styles

#General

####Typography.js This is a small project that simply brings together several useful JavaScript functions. https://github.com/elliottcable/typography.js

####Font.js This library adds a Font object to the collection of predefined objects available to you when doing JS coding for the web.
http://pomax.nihongoresources.com/pages/Font.js/

####Typesetter.js an open source project with the goal of bringing better typography to every type of digital screen
https://github.com/nofont/Typesetter.js

####typogr.js provides a set of functions which automatically apply various transformations to plain text in order to yield typographically-improved HTML.
https://github.com/ekalinin/typogr.js

####Calzone Better typesetting for EPUB (and HTML). https://github.com/simoncozens/calzone

#Hypenation:

####TeX line breaking algorithm in JavaScript. https://github.com/bramstein/typeset

####Hypher A small and fast JavaScript hyphenation engine. Can be used in Node.js and as a jQuery plugin. https://github.com/bramstein/Hypher

####BalanceText A jQuery plugin to provide an alternate text wrapping algorithm.
https://github.com/adobe-webplatform/balance-text

#Widows:

####The Widow Tamer …is a Javascript to automatically fix typographic widows on your web pages. https://github.com/nathanford/widowtamer

####typorphanage A simple jQuery script for managing typographic orphans & widows as programmatically as possible. https://github.com/Nilloc/typorphanage

#Ellipsis:

####trunk8 jQuery Truncation Plugin based on n.° of lines.
https://github.com/rviscomi/trunk8

Zepto version
https://github.com/etouches/trunk8-zepto

####Ellipsis Ellipsis is a customizable jQuery plugin for the smart truncation of text base on container width and not character count.
https://github.com/kanikarphan/ellipsis

####Clamp.js Clamps an HTML element by adding ellipsis to it if the content inside is too long. https://github.com/josephschmitt/Clamp.js

####jQuery.dotdotdot an advanced cross-browser ellipsis for multiple line content plugin.
http://dotdotdot.frebsite.nl/

####TextTailor.js
Tailor-made text to fit your needs! Responsive text to fill the height of the parent element or ellipse it when it doesn't fit.
http://jpntex.com/texttailor/

#Wrap around:

####jQSlickWrap the pixel-perfect prose plugin.
https://github.com/jasonwyatt/jQSlickWrap

####Bacon! a jQuery plugin that allows you to wrap text around a bezier curve or a line.
https://github.com/hudsonfoo/jQuery-Bacon

#Kerning

####kern.js A super-simple bookmarklet for designers that finally puts you back in control of your website's typography.
http://www.kernjs.com/

####jKerny kerning get easy.
https://github.com/clearideaz/jKerny

####TypeButter allows you to set optical kerning for any font on your website.
http://typebutter.com/

####Kerning.js take control of your web typography
https://github.com/endtwist/kerning.js

#Vertical rhythm

####Auto line-height a jQuery plugin for flexible layouts.
http://www.ollicle.com/2007/jun/03/jquery_lineheight_flexible.html

####Line In Typography
https://github.com/SimonFairbairn/Line-In-Typography

####jMetronome
Using jQuery to keep typographic rhythm.
http://www.fortes.com/2008/jmetronome-using-jquery-to-keep-typographic-rhythm

####Baseline.js Baseline.js is a simple jQuery plugin for restoring baselines thrown off by odd image sizes.
https://github.com/daneden/Baseline.js

#Fitting Text

####FitText.js a jQuery plugin for inflating web type.
https://github.com/davatron5000/FitText.js

####jSlabify a jQuery plugin for creating slabbed typography.
https://github.com/gschoppe/jSlabify

####BigText jQuery plugin
https://github.com/zachleat/BigText

####Hatchshow is a jQuery typesetting plugin. it balances measures.
http://charliepark.org/hatchshow/

####Slabtext a jquery plugin for producing big, bold & responsive headlines.
https://github.com/freqDec/slabText/

####TextTailor.js
🆕 Tailor-made text to fit your needs! Responsive text to fill the height of the parent element or ellipse it when it doesn't fit.
http://jpntex.com/texttailor/

####jQuery responsiveText :new: A jQuery plugin to set font sizes responsively based on its' container width. Use jQuery responsiveText to have scalable headlines, build responsive tables and more!
https://github.com/ghepting/jquery-responsive-text

####textFit v2.1.0 :new: A fast, jQuery-free text sizing component that quickly fits single and multi-line text to the width (and optionally height) of its container.
https://github.com/STRML/textFit

####Squishy.js :new: Squishy is a jQuery plugin that automatically resizes text to exactly fit the container with no extra work on your part.
http://cmsauve.com/projects/squishy/

####jQuery TextFill :new: This jQuery plugin resizes text to make it fit into a container. The font size gets as big as possible.
https://github.com/jquery-textfill/jquery-textfill

####WideText :new: A lightweight jQuery plugin that allows your to create full width text elements that will resize according to the browser window.
https://bitbucket.org/cbavota/widetext/

####textStretch.js :new: A javascript function and a jQuery extension for maximizing font sizes to fill out the element's width.
textStretch.js is minimal, fast and robust. It doesn't require or add any wrappers or child-elements, and it adapts to when you resize the window or flip your device. textStretch is build with older browsers in mind. It's tested and works with Chrome, Safari, Firefox and Internet Explorer (I haven't tested any version older than 6 though).

####Font-to-Width :new: Font-To-Width if a small Javascript routine which fits text to the width of an element using multiple font families of different widths.
https://github.com/chrissam42/font-to-width

####Fitter Happier Text :new: Performant, fully fluid headings
http://jxnblk.github.io/fitter-happier-text/

#Responsive

####Responsive-Measure A jQuery plugin for generating a responsive ideal measure. https://github.com/jbrewer/Responsive-Measure

####jQuery.responsiveText A simple jQuery plugin to make a specific selector's or the whole page's text responsive. https://github.com/klr/jQuery.responsiveText

####FlowType.JS :new: Responsive web typography at its finest: font-size and line-height based on element width.
http://simplefocus.com/flowtype/

####jQuery.fontFlex :new: Lightweight jQuery extension for dynamically changing font sizes according to screen / browser width. Intended to be used with responsive or adaptive CSS layouts.
https://github.com/NathanRutzky/jQuery.fontFlex

#Individual Letter Control

####Lettering.js a jQuery plugin for radical Web Typography. https://github.com/davatron5000/Lettering.js

#Special Effects

####Web Typography for the Lonely http://webtypographyforthelonely.com/

####Arctext.js curving text with css3 & jquery. http://tympanus.net/Development/Arctext/

####TextGrad jQuery plugin A plugin to make color gradients in texts. https://github.com/subtenante/TextGrad

####Textualizer a jQuery plug-in that allows you to transition through blurbs of text. https://github.com/krisk/textualizer

####Shuffle Letters Effect a jQuery Plugin.
http://tutorialzine.com/2011/09/shuffle-letters-effect-jquery/

####jQisotext jquery text effect plugin.
https://code.google.com/p/jqisotext/downloads/list

####Airport jqQery plugin which emulates the style of those flickering information boards.
http://www.unwrongest.com/projects/airport/

####grab bag assorted text effects jQuery plugins
http://onehackoranother.com/projects/jquery/jquery-grab-bag/text-effects.html

####Creative web typography styles http://tympanus.net/codrops/2012/09/12/creative-web-typography-styles/