Fit Text

Fit Text

About Fit Text

Fit Text is a jQuery plugin to make font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element. Fit Text is a perfect choice while developing cross-platform websites (scalable for all those nifty devices and displays).

A jQuery plugin for inflating web type

Need for Fit Text

Imagine, how your design layout would appear to users on a nifty handheld device and to the person viewing it on a hi-resolution wide screen. With so many browsing options (iPad, Tablets, Mobile Phones, Wide Screen Monitors, etc.), you can limit your design to pre-defined scales. It has to be fluid and scalable – not just the layout but the entire text in your website/web application so users can read contents easily. Challenging? Not actually, at least not with Fit Text.


Before using this module, make sure that

  • Use responsive theme (such as Omega).
  • The text should be larger.


You can enter a list of jQuery selectors. They will be output in the format:


The second configuration of the Fit Text is Compressor. If your text is resizing poorly, you'll want to turn tweak up/down "The Compressor". It works a little like a guitar amp. The default is 1.

$("#responsive_headline").fitText(1.2); // Turn the compressor up (text shrinks more aggressively)
$("#responsive_headline").fitText(0.8); // Turn the compressor down (text shrinks less aggressively)