Convert Figma logo to code with AI

source-foundry logoHack

A typeface designed for source code

16,391
613
16,391
125

Top Related Projects

76,660

Free monospaced font with programming ligatures

This is a fun, new monospaced font that includes programming ligatures and is designed to enhance the modern look and feel of the Windows Terminal.

Monospaced font family for user interface and coding environments

JetBrains Mono – the free and open-source typeface for developers

18,991

Versatile typeface for code, from code.

9,552

The package of IBM’s typeface, IBM Plex.

Quick Overview

Hack is a typeface designed for source code. It's an open-source font that has been meticulously crafted to enhance readability and provide a clean, distinctive look for programming environments. Hack is optimized for viewing source code and supports a wide range of programming languages and text editors.

Pros

  • Highly legible at small sizes, making it ideal for long coding sessions
  • Extensive character set supporting many programming languages and symbols
  • Regular updates and improvements based on community feedback
  • Available in multiple weights and styles (regular, bold, italic, bold italic)

Cons

  • May not be suitable for all personal preferences in coding aesthetics
  • Limited to monospaced design, which some developers may find restrictive
  • Requires manual installation on some systems, unlike pre-installed system fonts
  • May not render consistently across all platforms and applications

Getting Started

To use Hack in your development environment:

  1. Visit the Hack releases page on GitHub
  2. Download the latest version of the font files
  3. Install the font files on your system:
    • Windows: Right-click the font files and select "Install"
    • macOS: Double-click the font files and click "Install Font"
    • Linux: Copy the font files to ~/.local/share/fonts and run fc-cache -f -v
  4. Configure your text editor or IDE to use Hack as the default font
  5. Restart your development environment if necessary

Example configuration for Visual Studio Code (settings.json):

{
  "editor.fontFamily": "Hack, monospace",
  "editor.fontSize": 14
}

Competitor Comparisons

76,660

Free monospaced font with programming ligatures

Pros of FiraCode

  • Features ligatures for common programming symbols, enhancing code readability
  • Wider range of supported characters and languages
  • More frequent updates and active community contributions

Cons of FiraCode

  • Larger file size due to additional ligatures and glyphs
  • May not render correctly in all text editors or IDEs
  • Some developers find ligatures distracting or confusing

Code Comparison

Hack:

if (x != 0 && y >= 10) {
    return x -> y;
}

FiraCode:

if (x != 0 && y >= 10) {
    return x -> y;
}

In the FiraCode example, ligatures would visually combine !=, >=, and -> into single glyphs, while Hack would display them as separate characters.

Both fonts are monospaced and designed for programming, offering clear distinction between similar characters (like 'l', '1', and 'I'). Hack focuses on simplicity and readability without ligatures, while FiraCode emphasizes visual cohesion through ligatures. The choice between them often comes down to personal preference and specific use cases.

This is a fun, new monospaced font that includes programming ligatures and is designed to enhance the modern look and feel of the Windows Terminal.

Pros of Cascadia Code

  • Designed specifically for modern coding environments, with a focus on readability in IDEs and terminals
  • Includes programming ligatures, enhancing code readability for certain operators and symbols
  • Developed and maintained by Microsoft, ensuring regular updates and wide compatibility

Cons of Cascadia Code

  • Limited language support compared to Hack, which covers a broader range of scripts and languages
  • Newer font with less established track record in various development environments
  • May require manual configuration in some IDEs to enable ligatures

Code Comparison

Hack:

if (condition) {
    doSomething();
} else {
    doSomethingElse();
}

Cascadia Code:

if (condition) {
    doSomething();
} else {
    doSomethingElse();
}

The main difference in appearance would be the ligatures in Cascadia Code, which would combine certain character pairs like =>, !=, and <= into single glyphs for improved readability.

Monospaced font family for user interface and coding environments

Pros of Source Code Pro

  • Wider range of weights and styles, offering more design flexibility
  • Developed by Adobe, potentially benefiting from their typographic expertise
  • Extensive language support and larger character set

Cons of Source Code Pro

  • Larger file size due to more extensive character set
  • May have a steeper learning curve for customization
  • Less frequent updates compared to Hack

Code Comparison

Source Code Pro:

void example() {
    int x = 42;
    printf("Hello, World!");
}

Hack:

void example() {
    int x = 42;
    printf("Hello, World!");
}

Both fonts render code clearly and legibly, with similar character shapes and spacing. The main differences are subtle and relate to specific glyph designs rather than overall readability.

Summary

Source Code Pro and Hack are both excellent monospaced fonts for coding. Source Code Pro offers more variety in weights and styles, while Hack focuses on a streamlined, highly readable design. The choice between them often comes down to personal preference and specific use cases. Source Code Pro might be preferred for projects requiring diverse typography, while Hack could be favored for its simplicity and frequent updates.

JetBrains Mono – the free and open-source typeface for developers

Pros of JetBrainsMono

  • Ligatures support for improved code readability
  • Wider range of supported characters and symbols
  • Designed specifically for modern IDEs and coding environments

Cons of JetBrainsMono

  • Larger file size due to extensive character set
  • May not render well on older systems or low-resolution displays
  • Some developers find ligatures distracting or confusing

Code Comparison

Hack:

def factorial(n):
    if n == 0:
        return 1
    else:
        return n * factorial(n - 1)

JetBrainsMono:

def factorial(n):
    if n == 0:
        return 1
    else:
        return n * factorial(n - 1)

While the code itself is identical, JetBrainsMono's ligatures would render certain combinations differently:

  • == would appear as a single, connected symbol
  • -> in function return types would be a single arrow glyph
  • <= and >= would have custom glyphs for better readability

Both fonts offer excellent readability for code, but JetBrainsMono's ligatures and extensive character set may provide a slight edge in modern development environments. However, Hack's simplicity and smaller file size make it a solid choice for developers who prefer a more traditional monospaced font or work in diverse environments.

18,991

Versatile typeface for code, from code.

Pros of Iosevka

  • Highly customizable with numerous build options
  • Supports a wide range of languages and scripts
  • Offers both monospaced and proportional variants

Cons of Iosevka

  • Larger file size due to extensive character set
  • May require more setup time to achieve desired configuration
  • Less conventional design might not suit all preferences

Code Comparison

Hack:

void example() {
    int x = 42;
    printf("Hello, World!");
}

Iosevka:

void example() {
    int x = 42;
    printf("Hello, World!");
}

While both fonts are designed for coding, Iosevka's default style is slightly more condensed and geometric, potentially allowing for more characters per line. Hack maintains a more traditional programming font appearance.

Iosevka offers extensive customization options, allowing users to tailor the font to their specific needs. This includes adjusting character width, style variants, and even creating custom builds. Hack, on the other hand, provides a more standardized look out of the box, which may be preferred by those who want a consistent experience across different environments.

Both fonts support ligatures and a wide range of programming-related glyphs, making them suitable for various coding tasks and languages.

9,552

The package of IBM’s typeface, IBM Plex.

Pros of Plex

  • Comprehensive typeface family with sans, serif, and monospace variants
  • Extensive language support and Unicode coverage
  • Corporate backing from IBM, ensuring ongoing development and support

Cons of Plex

  • Larger file size due to the extensive character set and variants
  • May not be as optimized for coding-specific use cases as Hack
  • Potential licensing concerns for some users due to IBM's involvement

Code Comparison

While both fonts are suitable for coding, here's a brief example of how they might look:

Hack:

def greet(name):
    return f"Hello, {name}!"

Plex Mono:

def greet(name):
    return f"Hello, {name}!"

The differences are subtle, but Hack may have slightly better readability for extended coding sessions, while Plex Mono offers a more modern and versatile aesthetic.

Both Hack and Plex are excellent choices for developers, with Hack focusing specifically on coding needs and Plex offering a broader range of typographic options. The choice between them often comes down to personal preference and specific use cases.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Hack

GitHub release Build Status Contributors Join the chat at https://gitter.im/source-foundry/Hack Github All Releases

Don't like the development noise from the repository but want to keep up with changes? Check out our gitter Hack channel. Have a quick question that doesn't require an issue report? Drop by our gitter Help channel and ask away.

A typeface designed for source code

Hack is designed to be a workhorse typeface for source code. It has deep roots in the free, open source typeface community and expands upon the contributions of the Bitstream Vera & DejaVu projects. The large x-height + wide aperture + low contrast design make it legible at commonly used source code text sizes with a sweet spot that runs in the 8 - 14 range. The full set of changes to the upstream source are available in the changelog.

The project is in active development, and we welcome your input and contributions. You may view our design objectives and instructions on how to contribute in CONTRIBUTING.md.

Frequently asked questions are answered in our FAQ.

Contents

Specimen

Hack — a typeface designed for source code

Overview of features

  • Typeface Name: Hack
  • Category: Monospaced
  • Character set support: ASCII, Latin-1, Latin Extended A, Greek, Cyrillic
  • Powerline Support: Yes, included by default
  • Included Styles: Regular, Bold, Italic, Bold Italic

Quick installation

NOTE ON FONT UPDATES If you are updating your version of Hack, be sure to remove the previously installed version and clear your font cache first to avoid conflicts that can lead to platform-specific rendering errors. Many platforms/distros offer package managers that automate this process. We release a Windows installer to automate the install/update process on the Windows platform. See below for additional details.

Linux

  1. Download the latest version of Hack.
  2. Extract the files from the archive (.zip).
  3. Copy the font files to either your system font folder (often /usr/share/fonts/) or user font folder (often ~/.local/share/fonts/ or /usr/local/share/fonts).
  4. Copy the font configuration file in config/fontconfig/ to either the system font configuration folder (often /etc/fonts/conf.d/) or the font user folder (often ~/.config/fontconfig/conf.d)
  5. Clear and regenerate your font cache and indexes with the following command:
$ fc-cache -f -v

You can confirm that the fonts are installed with the following command:

$ fc-list | grep "Hack"

Some Linux users may find that font rendering is improved on their distro with these instructions.

macOS

  1. Download the latest version of Hack.
  2. Extract the files from the archive (.zip) and click to open them.
  3. Follow the instructions from your operating system.
  4. Enjoy!

Windows

Hack Windows Installer

The Hack Windows Installer simplifies installation on the Windows platform. The tool guides you through the installation process and addresses some common rendering issues that occur with font installs/updates on the Windows platform. This tool is the recommended installation approach for Windows users.

Chrome/ChromeOS

To use with Secure Shell, edit the following fields in Options:

  • font-family: "Hack"
  • user-css: https://cdn.jsdelivr.net/npm/hack-font@3/build/web/hack.css

Package managers

We highly recommend the convenience of a community developed package manager or other auto-updating utility if this is available on your platform. While the package manager releases may be a bit delayed relative to the repository releases, the packages distributed through these package managers were designed to tune and automate font installs and updates on your system.

We are aware of Hack support in the following package managers (with associated package names):

  • Arch Linux: ttf-hack
  • Chocolatey (Windows): hackfont
  • Debian: fonts-hack-ttf
  • Fedora / CentOS: dnf-plugins-core :: heliocastro/hack-fonts :: hack-fonts
  • Gentoo Linux: media-fonts/hack
  • Homebrew Cask (OS X): homebrew/cask-fonts/font-hack
  • Open BSD: fonts/hack-fonts
  • OpenSUSE: hack-fonts
  • Ubuntu: fonts-hack-ttf
  • Visual Studio Package Manager: hack.font

For installation issues with Hack packages, please contact the package maintainer directly.

Web font usage

Hack is available in the woff and woff2 web font formats. Bold and italic styles are included by default and work out-of-the-box via the <strong> and <em> tags.

Hack is available through the jsDelivr and cdnjs CDN services:

jsDelivr cdnjs

The following snippets provide examples of Hack web font use through the jsDelivr CDN. Adjust the URL paths to those provided by cdnjs (click the link above to find the appropriate URL) to switch to the cdnjs CDN.

1. Add Hack to HTML

Include one of the following in the <head> section of your HTML file:

Subset web fonts

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/hack-font@3/build/web/hack-subset.css">

Full character set web fonts

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/hack-font@3/build/web/hack.css">

2. Add Hack to CSS

pre, code { font-family: Hack, monospace; }

See the WEBFONT_USAGE.md documentation for additional details, including instructions on how to download, host, and serve the web fonts on your web server.

Additional tools for Hack font customization

Customize your build with alternate glyph styles

The alt-hack library includes a (growing) collection of alternate glyph styles that can be used to customize your Hack fonts. Don't like the default zero style? Swap out the UFO design source with a slashed zero or dotted zero and build new fonts that work better for you.

We welcome contributions of new alternate glyph styles in the alt-hack repository. Design something new that works well with rest of the typeface and submit a pull request to the alt-hack repository so that others can use it in their custom builds.

Detailed build instructions are available on the alt-hack repository README.md. Font renaming instructions to support side-by-side installs with upstream Hack are available below.

Line spacing adjustments

font-line is a tool that modifies the default line spacing used in the Hack design (20% UPM).

The following gist installs font-line and modifies line spacing for all desktop font files contained in the same directory:

Install modified and unmodified versions of Hack on the same system

If you modify the upstream Hack source or the released font binaries and would like to install your modified fonts on the same system with the Hack fonts as released here, you can use the fontname.py Python script to define a new font name in the binary files. For example, you can install Hack on your platform along with a 15% UPM line spacing adjusted version as Hack Fifteen. Modify default glyphs with those in our alt-hack repository or design your own and define your creation with any name that you'd like. Following installation, your renamed fonts should show under the name that you define with the script so that you can switch between any of them as you need.

Usage details and examples are provided on the fontname.py repository README.

Resources

Contributing

We welcome contributions to Hack! Please review our CONTRIBUTING.md document for details.

Built With

Hack is built with the following free, open source projects:

  • Font Bakery - post-compilation modifications
  • fontmake - UFO to ttf compilation
  • fontTools - OpenType table read/write
  • font-v - font version string editor
  • ink - stream editor for text file templating
  • OpenFV - open specification for semantic typeface versioning
  • sfnt2woff_zopfli - ttf to woff web font compilation
  • ttfautohint - ttf instruction sets
  • uni - Unicode code point search
  • ufodiff - UFO source diffs
  • ufoLib - UFO source file reads/writes/testing
  • ufolint - UFO source file linting for CI testing
  • woff2 - ttf to woff2 web font compilation

Acknowledgments

We would like to acknowledge and thank the jsDelivr and cdnjs teams for their support of the Hack project through their free web font CDN services. We greatly appreciate the tremendous support of open source software development by the Semaphore CI team. Their free CI testing service and rapid, excellent technical support have been tremendous assets for our project. Lastly, a huge thanks go out to all of those who do the unrecognized work to get Hack out there to users so that it is easy to access, install, upgrade, and use. There are redistribution package managers, review committee members, testers, and others across platforms/distros/applications who perform this thankless work and often go unrecognized. Your efforts are much appreciated.

License

Hack work is © 2018 Source Foundry Authors. MIT License

Bitstream Vera Sans Mono © 2003 Bitstream, Inc. (with Reserved Font Names Bitstream and Vera). Bitstream Vera License.

The font binaries are released under a license that permits unlimited print, desktop, web, and software embedding use for commercial and non-commercial applications.

See LICENSE.md for the full texts of the licenses.