---
name: Fira Code
date_added: 2019-01-21
category: Monospaced
styles: Variable
weights: [{ weight: 300, name: 'Light' },
          { weight: 400, name: 'Regular' },
          { weight: 500, name: 'Medium' },
          { weight: 700, name: 'Bold' }]
latest_release: { version: 'v4.0', date: '18 May 2020' }
project_url: https://github.com/tonsky/FiraCode
creator: { name: 'Nikita Prokopov', url: 'https://twitter.com/nikitonsky' }
description: Fira Code is a monospaced typeface optimized for reading and writing code. It has a huge number of ligatures catering to a variety of programming languages, making code more concise and readable.
comparison_faces: [IBM Plex Mono, Source Code Pro, Space Mono]
---

<div class='type-detail-table gr7 gc6'>
  <div class='meta dark top'>
    <p class='name'>Standard Ligatures (selection)</p>
    <p class='code'>font-feature-settings: 'liga', 'clig';</p>
  </div>
  <div class='examples flow-row'>
    <div><span class='fade ms6'>www</span> <span class='liga ms6'>www</span></div>
    <div><span class='fade ms6'>&&</span> <span class='liga ms6'>&&</span></div>
    <div><span class='fade ms6'> => </span> <span class='liga ms6'> => </span></div>
    <div><span class='fade ms6'> <=> </span> <span class='liga ms6'> <=> </span></div>
    <div><span class='fade ms6'> ||> </span> <span class='liga ms6'> ||> </span></div>
    <div><span class='fade ms6'> ++ </span> <span class='liga ms6'> ++ </span></div>
    <div><span class='fade ms6'>***</span> <span class='liga ms6'>***</span></div>
    <div><span class='fade ms6'>*></span> <span class='liga ms6'>*></span></div>
    <div><span class='fade ms6'>*/</span> <span class='liga ms6'>*/</span></div>
    <div><span class='fade ms6'>{|</span> <span class='liga ms6'>{|</span></div>
    <div><span class='fade ms6'>[|</span> <span class='liga ms6'>[|</span></div>
    <div><span class='fade ms6'>]#</span> <span class='liga ms6'>]#</span></div>
    <div><span class='fade ms6'>::</span> <span class='liga ms6'>::</span></div>
    <div><span class='fade ms6'>::=</span> <span class='liga ms6'>::=</span></div>
    <div><span class='fade ms6'>:=</span> <span class='liga ms6'>:=</span></div>
    <div><span class='fade ms6'>!!</span> <span class='liga ms6'>!!</span></div>
    <div><span class='fade ms6'> == </span> <span class='liga ms6'> == </span></div>
    <div><span class='fade ms6'>!=</span> <span class='liga ms6'>!=</span></div>
    <div><span class='fade ms6'> === </span> <span class='liga ms6'> === </span></div>
    <div><span class='fade ms6'> !== </span> <span class='liga ms6'> !== </span></div>
    <div><span class='fade ms6'> ## </span> <span class='liga ms6'> ## </span></div>
    <div><span class='fade ms6'> ### </span> <span class='liga ms6'> ### </span></div>
    <div><span class='fade ms6'> #### </span> <span class='liga ms6'> #### </span></div>
    <div><span class='fade ms6'> #= </span> <span class='liga ms6'> #= </span></div>
    <div><span class='fade ms6'> #? </span> <span class='liga ms6'> #? </span></div>
    <div><span class='fade ms6'> #_ </span> <span class='liga ms6'> #_ </span></div>
    <div><span class='fade ms6'> #_( </span> <span class='liga ms6'> #_( </span></div>
    <div><span class='fade ms6'> .= </span> <span class='liga ms6'> .= </span></div>
    <div><span class='fade ms6'> ..= </span> <span class='liga ms6'> ..= </span></div>
    <div><span class='fade ms6'> ?: </span> <span class='liga ms6'> ?: </span></div>
    <div><span class='fade ms6'> ?. </span> <span class='liga ms6'> ?. </span></div>
    <div><span class='fade ms6'> /= </span> <span class='liga ms6'> /= </span></div>
    <div><span class='fade ms6'> /== </span> <span class='liga ms6'> /== </span></div>
    <div><span class='fade ms6'> /> </span> <span class='liga ms6'> /> </span></div>
    <div><span class='fade ms6'> // </span> <span class='liga ms6'> // </span></div>
    <div><span class='fade ms6'> _|_ </span> <span class='liga ms6'> _|_ </span></div>
    <div><span class='fade ms6'> __ </span> <span class='liga ms6'> __ </span></div>
  </div>
</div>

<div class='type-detail-table examples-figures gr5 gc6'>
  <div class='meta dark top'>
    <p class='name'>Figures</p>
  </div>
  <div class='examples flow-column flow-center'>
    <div>
      <h1 class='oldstyle-tabular'>1234567890</h1>
      <p class='character-label'>Tabular Oldstyle: 'tnum', 'onum'</p>
    </div>
    <div>
      <h1 class='lining-tabular'>1234567890</h1>
      <p class='character-label'>Tabular Lining (default): 'tnum', 'lnum'</p>
    </div>
    <div>
      <h1><span class='fade'>0</span> <span class='zero'>0</span></h1>
      <p class='character-label'>Slashed Zero: 'zero'</p>
    </div>
    <div>
      <h1><span class='fade'>A</span><span class='subscript'>1234567890</span></h1>
      <p class='character-label'>Subscripts: 'subs'</p>
    </div>
    <div>
      <h1><span class='fade'>A</span><span class='superscript'>1234567890</span></h1>
      <p class='character-label'>Superscripts: 'sups'</p>
    </div>
  </div>
</div>

<div class='type-detail-table gr2 gc6'>
  <div class='meta dark top'>
    <p class='name'>Alternate Glyph Forms</p>
    <p class='code'>font-feature-settings: 'ss--';</p>
  </div>
  <div class='examples flow-row'>
    <div><span class='fade'>r</span> <span class='ss01'>r</span> <p class='code'>'ss01'</p></div>
    <div><span class='fade'>&</span> <span class='ss03'>&</span> <p class='code'>'ss02'</p></div>
    <div><span class='fade'>$</span> <span class='ss04'>$</span> <p class='code'>'ss04'</p></div>
    <div><span class='fade'>@</span> <span class='ss05'>@</span> <p class='code'>'ss05'</p></div>
    <div><span class='fade'>\\</span> <span class='ss06'>\\</span> <p class='code'>'ss06'</p></div>
  </div>
</div>

<div class='type-detail-table gr2 gc6'>
  <div class='meta dark top'>
    <p class='name'>Ordinals</p>
    <p class='code'>font-feature-settings: 'ordn';</p>
  </div>
  <div class='examples flow-row'>
    <div><span class='fade'>3a</span> <span class='ordinals'>3a</span></div>
    <div><span class='fade'>4o</span> <span class='ordinals'>4o</span></div>
    <div><span class='fade'>No.</span> <span class='ordinals'>No.</span></div>
  </div>
</div>

<div class='type-detail-table gr3 gc6'>
  <div class='meta dark top flex-row'>
    <p class='name'>Special Characters</p> <a href='glyphs/' class='glyph-explorer'>Explore all characters</a>
  </div>
  <div class='examples flow-row'>
    <div><span>&uarr;</span> <p class='code'>&amp;uarr;</p></div>
    <div><span>&rarr;</span> <p class='code'>&amp;rarr;</p></div>
    <div><span>&darr;</span> <p class='code'>&amp;darr;</p></div>
    <div><span>&larr;</span> <p class='code'>&amp;larr;</p></div>
    <div><span>&para;</span> <p class='code'>&amp;para;</p></div>
    <div><span>&sect;</span> <p class='code'>&amp;sect;</p></div>
    <div><span>&dagger;</span> <p class='code'>&amp;dagger;</p></div>
    <div><span>&Dagger;</span> <p class='code'>&amp;Dagger;</p></div>
    <div><span>&#8999;</span> <p class='code'>&amp;#8999;</p></div>
    <div><span>&#9760;</span> <p class='code'>&amp;#9760;</p></div>
    <div><span>&#9680;</span> <p class='code'>&amp;#9680;</p></div>
    <div><span>&#9786;</span> <p class='code'>&amp;#9786;</p></div>
  </div>
</div>