JavaScript Typography

Open-source JavaScript projects categorized as Typography

Top 19 JavaScript Typography Projects

  • rebass

    :atom_symbol: React primitive UI components built with styled-system.

    Project mention: Comparing React Component Libraries | | 2022-09-16

    If you are a fan of Styled System, you are sure to love this library, as it was built on top of Styled System. I consider Rebass to be the most unopinionated library on the list, as unlike Material Ui, Semantic UI, and Bootstrap, its components do not come with a default theme, giving you the freedom to add your preferred theme to your application. Its styles are also much easier to override. Rebass is minimalist and was designed with style extension in mind.

  • styled-system

    ⬢ Style props for rapid UI development

    Project mention: Why Chakra? | | 2023-02-22

    But yeah, Tailwind fanboys do hate it, because Chakra needs some initial time to research and understand how it works under the hood. And then it gets super easy and intuitive to use. It's an implementation of a general concept abstraction called styled-system, I advise anyone to start their learning about Chakra from there:

  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • Lettering.js

    A lightweight, easy to use Javascript <span> injector for radical Web Typography

    Project mention: Letter-Spacing extend just for specific characters numbers | | 2023-01-20

    I bookmarked this at some point a while back but haven't used it yet. So, I can't vouch for it working but conceptually it is the thing.

  • FlowType.JS

    Web typography at its finest: font-size and line-height based on element width.

  • typography

    A powerful toolkit for building websites with beautiful design

  • react-native-typography

    Pixel–perfect, native–looking typographic styles for React Native ✒️

  • Blotter

    A JavaScript API for drawing unconventional text effects on the web.

  • SurveyJS

    Extensible JavaScript Form Builder Libraries. SurveyJS is a set of four fully customizable JS libraries that allow you to create, easily modify, and run multiple web forms in any web app, while retaining all sensitive data on your own servers.

  • typeit

    The most versatile JavaScript typewriter effect library on the planet.

    Project mention: Making my Library Open Source but paid for corporates | | 2022-12-31

    I don’t know if you can restrict its usage in that way (wouldn’t that no longer make it open source), but you can charge for commercial usage while keeping the source open. I do this with TypeIt under a GPLv3 license:

  • Han

    「漢字標準格式」印刷品般的漢字排版框架 Han.css: the CSS typography framework optimised for Hanzi.

  • universal-resume

    Minimal and formal résumé (CV) website template for print, mobile, and desktop.

  • BigText

    jQuery plugin, calculates the font-size and word-spacing needed to match a line of text to a specific width.

  • circletype

    A JavaScript library that lets you curve type on the web.

  • prototypo

    Create your own font in a few clicks

  • Typetura

    Finally, typography as responsive as the web.

  • tailwindcss-fluid-type

    A plugin that makes the use of Fluid Type a breeze.

    Project mention: What 3rd party plugins do you use? | | 2022-05-17
  • novacancy.js

    Text Neon Golden effect jQuery plug-in

  • tone

    A Cross-Cultural Writing System (by tunebond)

    Project mention: How do you use your conlang? | | 2022-10-14

    Also I think it would be interesting to also be able to speak it, so trying to make it easy for people from various languages to pronounce, though I chose to include most consonants so that might be a challenge for some. It also uses the Tone writing system.

  • vivid_vector_alphabet

    Beautiful Hand Drawn Letters ⭐ A meticulous merger of form and function. Typography Animation Microinteraction -Star it!

    Project mention: Beautiful Hand Drawn Letters SVGs | | 2022-05-28
  • web-components

    Nativ web components for typographic projects: <foot-note>, <inline-note>, <note-list> (by RolandDreger)

  • Sonar

    Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2023-02-22.

JavaScript Typography related posts


What are some of the best open-source Typography projects in JavaScript? This list will help you:

Project Stars
1 rebass 7,883
2 styled-system 7,569
3 Lettering.js 5,404
4 FlowType.JS 4,619
5 typography 3,776
6 react-native-typography 3,356
7 Blotter 2,934
8 typeit 2,840
9 Han 2,344
10 universal-resume 1,598
11 BigText 886
12 circletype 640
13 prototypo 423
14 Typetura 360
15 tailwindcss-fluid-type 218
16 novacancy.js 185
17 tone 41
18 vivid_vector_alphabet 21
19 web-components 9
Access the most powerful time series database as a service
Ingest, store, & analyze all types of time series data in a fully-managed, purpose-built database. Keep data forever with low-cost storage and superior data compression.