Skip to content
This repository has been archived by the owner on Mar 9, 2018. It is now read-only.


Folders and files

Last commit message
Last commit date

Latest commit



31 Commits

Repository files navigation

DEPRECATED (This plugin is no longer maintained


A quick and dirty way to fit your text

jquery-quickfit-plugin is a quick and dirty solution to fit html text into its surrounding container.

jquery-quickfit is for you, if:

  • you want to resize multiple items in a short amount of time
  • you want good performance when you resize an item multiple times (e.g., on window resize)
  • you want to autofit a single line of text

jquery-quickfit is not for you, if:

  • you need to fit a single text once
  • you want to fit a paragraph of text, spanning multiple lines


Include jquery and jquery-quickfit int the header. Then simply call


on the element you want to fit.



<div id="quickfit">Text to fit*</div>


<script src=".../jquery.min.js" type="text/javascript" />
<script src="../script/jquery.quickfit.js" type="text/javascript" />
<script type="text/javascript">
  $(function() {
  • in order to work correctly, this line should be styled with the white-space:nowrap option


Name Type Default Description
min integer 8 The minimum font-size the element can be sized to
max integer 12 The maximum font-size the element can be sized to
truncate boolean false Flag, whether the text should be truncated (shortened with an appended '...') if it doesn't fit with the minimum size.
tolerance float 0.02 Adds a padding to the calculation. The higher the value, the smaller the chance the text will overlap its container. This value should be fiddled with, when encountering problems on a certain font.
width int null You can default quickfit a size to which the text should be fitted to. Handy when fitting a lot of elements with an equal width.

How it works

Instead of using the shrink-to-fit-approach or the more performant shrink-by-ratio-variant, which brings perfect results, but causes frequent re-layouts and thus is rather slow when dealing with multiple resizes, quickfit calculates an onetime size invariant estimate for a text length and uses this to guesstimate the best font-size without requiring a relayout on a subsequent fit.


You can see jquery-quickfit in action here (Resize to see effect).


Rule of the thumb testing has shown quickfit about equally performant against the shrink-to-fit-approach, when resizing a single item once. When resizing multiple items, or a single item multiple times, jquery-quickfit outperforms shrink-to-fit significantly, see e.g., jsperf (the test would be very similar to a window resize).


jquery-quickfit-plugin is licensed under the Apache License 2.0.


A quick and dirty approach to fitting text into its surrounding container.






No releases published


No packages published