Programming fonts

├── capture ├── code_short.txt ├── code_long.jsx ├── ahk.ahk ├── ahk_gdipp.ahk └── generate_ahk_input.py ├── Makefile ├── index.html ├── jsx ├── FontImage.jsx ├── Fonti.jsx ├── Compare.jsx └── Overview.jsx ├── style.css └── README.md /capture/code_short.txt: -------------------------------------------------------------------------------- 1 | 2 | abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890 1Il|L 80Oo 5S ([{<>}]) \*/!?:;.,@=~^%$__# -------------------------------------------------------------------------------- /capture/code_long.jsx: -------------------------------------------------------------------------------- 1 | 2 | abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890 3 | 1Il|L 80Oo 5S ([{<>}]) \*+-–—/!?:;.,@=~^%$ __# "q" 'q' “q” ‘q’ 4 | ±…×· 5 | 6 | var sum = 0; 7 | for (var i=0; i 15 | fooBar 16 | 17 | ); 18 | } 19 | }); -------------------------------------------------------------------------------- /Makefile: -------------------------------------------------------------------------------- 1 | all: js/script.min.js 2 | 3 | js/script.min.js: js/script.js 4 | uglifyjs js/script.js --compress --screw-ie8 --mangle -o js/script.min.js 5 | 6 | js/script.js: jsx/* Makefile 7 | browserify jsx/Fonti.jsx -t babelify --outfile js/script.js 8 | 9 | 10 | .PHONY: trimmed_default 11 | trimmed_default: capture/ss/*.png 12 | mv capture/ss/* trimmed 13 | mogrify -crop 1888x1000+5+79 -trim trimmed/*.png 14 | mogrify -background "#222222" -splice 1x0 trimmed/short_dark_*_aa0.png 15 | mogrify -background "#fafafa" -splice 1x0 trimmed/short_light_*_aa0.png 16 | 17 | .PHONY: trimmed_gdipp 18 | trimmed_gdipp: capture/ss/*.png 19 | mv capture/ss/* trimmed 20 | mogrify -crop 1888x1000+5+79 -trim trimmed/*.png 21 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Programming fonts 6 | 7 | 8 | 9 | 10 | 11 |

12 |

13 | GitHub Repo 14 |

15 |

16 |

17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /jsx/FontImage.jsx: -------------------------------------------------------------------------------- 1 | function fontUrl(sampleSize, theme, fontName, size, aaMode){ 2 | var url = "trimmed/"; 3 | 4 | url += sampleSize+"_"; 5 | url += (theme.toLowerCase()) + "_"; 6 | 7 | var sizeStr = ""; 8 | if(sampleSize === "long"){ 9 | sizeStr = size; 10 | }else{ 11 | if(size > 15) 12 | sizeStr = "big"; 13 | else 14 | sizeStr = "small"; 15 | } 16 | 17 | url += fontName.replace(/ /g, "-").replace(/\//g, "-")+"_"+sizeStr+"_"+aaMode+".png"; 18 | return url; 19 | } 20 | 21 | module.exports = React.createClass({ 22 | render: function(){ 23 | var url = fontUrl( 24 | this.props.sampleSize, 25 | this.props.theme, 26 | this.props.fontName, 27 | this.props.sizeStr, 28 | this.props.aaStr); 29 | return( 30 |

34 | ); 35 | } 36 | }); -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: "Helvetica Neue",Helvetica,"Segoe UI",Arial,freesans,sans-serif; 3 | margin: 0; 4 | } 5 | .Light{ 6 | background-color: #fafafa; 7 | } 8 | .Dark{ 9 | background-color: #222222; 10 | color: white; 11 | } 12 | #mainDiv{ 13 | padding: 0.5em; 14 | } 15 | 16 | a{ 17 | text-decoration: none; 18 | } 19 | a:hover{ 20 | text-decoration: underline; 21 | } 22 | .Light a{ 23 | color: black; 24 | } 25 | .Dark a{ 26 | color: white; 27 | } 28 | 29 | .Light .borderBelow{ 30 | border-bottom: medium solid #000000; 31 | } 32 | .Dark .borderBelow{ 33 | border-bottom: medium solid #ffffff; 34 | } 35 | 36 | .settingLabel{ 37 | margin-right: 1em; 38 | font-weight: bold; 39 | } 40 | .settingChoice{ 41 | cursor: pointer; 42 | margin-right: 0.5em; 43 | } 44 | 45 | .button{ 46 | cursor: pointer; 47 | min-width: 2em; 48 | text-align: center; 49 | } 50 | .Light .button:hover{ 51 | color: red; 52 | } 53 | .Dark .button:hover{ 54 | color: #ff9295; 55 | } 56 | 57 | .Light .settingActive{ 58 | color: red; 59 | } 60 | .Dark .settingActive{ 61 | color: #ff9295; 62 | } 63 | 64 | td > img{ 65 | vertical-align: middle; 66 | } 67 | .fontContainer{ 68 | padding: 0.5em; 69 | padding-bottom: 3em; 70 | } 71 | 72 | .aa_mode{ 73 | width: 1em; 74 | padding-left: 0.5em; 75 | padding-right: 0.5em; 76 | } 77 | .Light .aa0{ 78 | background-color: #ff9ca9; 79 | } 80 | .Light .aa1{ 81 | background-color: #a8ffa5; 82 | } 83 | .Dark .aa0{ 84 | background-color: #8b0709; 85 | } 86 | .Dark .aa1{ 87 | background-color: #00871f; 88 | } 89 | .contentContainer{ 90 | 91 | } 92 | table{ 93 | border-collapse: collapse; 94 | } 95 | .Light .firstRow{ 96 | background-color: #e5e5e5; 97 | } 98 | .Dark .firstRow{ 99 | background-color: #5a5a5a; 100 | } -------------------------------------------------------------------------------- /capture/ahk.ahk: -------------------------------------------------------------------------------- 1 | #NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. 2 | ; #Warn ; Enable warnings to assist with detecting common errors. 3 | SendMode Input ; Recommended for new scripts due to its superior speed and reliability. 4 | SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. 5 | 6 | SetTitleMatchMode, 2 7 | 8 | SetView(FontName, FontSize, aa, color) 9 | { 10 | ; Set font settings 11 | Send, view.run_command("set_setting", {{}"setting": "font_size", "value": %FontSize%{}}){Enter} 12 | 13 | Send, view.run_command("set_setting", {{}"setting": "font_face", "value": " 14 | SendRaw, %FontName% 15 | Send, "{}}){Enter} 16 | 17 | Send, view.run_command("set_setting", {{}"setting": "gutter", "value": False{}}){Enter} 18 | 19 | if (color="light"){ 20 | Send, view.run_command("set_setting", {{}"setting": "color_scheme", "value": "Packages/User/Monokai Extended Light_cus.tmTheme"{}}){Enter} 21 | }else{ 22 | Send, view.run_command("set_setting", {{}"setting": "color_scheme", "value": "Packages/User/Monokai Extended_cus.tmTheme"{}}){Enter} 23 | } 24 | 25 | ; Set AA 26 | if (aa="aa1"){ 27 | Send, view.run_command("set_setting", {{}"setting": "font_options", "value": []{}}){Enter} 28 | }else{ 29 | Send, view.run_command("set_setting", {{}"setting": "font_options", "value": ["no_antialias"]{}}){Enter} 30 | } 31 | 32 | Send, {Esc} ; Close console 33 | Sleep, 150 34 | } 35 | 36 | DoIt(codeLen, color, FontName, FontSize, aa) 37 | { 38 | ; Activate sublime window 39 | winactivate, Sublime Text 40 | WinWaitActive, Sublime Text 41 | 42 | ; 0-padded font size to two digits 43 | ; paddedSize := ((strlen(FontSize)<2) ? "0"FontSize : FontSize) 44 | 45 | ; MsgBox, %FontName% %FontSize% %aa% %codeLen% %color% 46 | 47 | 48 | ; Open sublime console 49 | Send, ^!c 50 | 51 | ; Open short code 52 | if (codeLen="short"){ 53 | Send, window.open_file("code_short.txt"){Enter} 54 | }else{ 55 | Send, window.open_file("code_long.jsx"){Enter} 56 | } 57 | 58 | SetView(FontName, FontSize, aa, color) 59 | 60 | ; ss_filename = C:\code\font_compare\capture\ss\ 61 | ; ss_filename = %ss_filename%testwindow.open_file("code_short.txt") 62 | ; MsgBox, %ss_filename% 63 | 64 | FontNameDashed := RegExReplace(FontName, " ", "-") 65 | FontNameDashed := RegExReplace(FontNameDashed, "/", "-") 66 | 67 | FontSizeStr := "" 68 | if (codeLen="long"){ 69 | FontSizeStr := FontSize 70 | }else{ 71 | if (FontSize > 15){ 72 | FontSizeStr := "big" 73 | }else{ 74 | FontSizeStr := "small" 75 | } 76 | } 77 | 78 | Run, c:\code\font_compare\capture\nircmd.exe savescreenshotwin "C:\code\font_compare\capture\ss\%codeLen%_%color%_%FontNameDashed%_%FontSizeStr%_%aa%.png" 79 | } 80 | 81 | Loop, read, c:\code\font_compare\capture\ahk_input.csv 82 | { 83 | Loop, parse, A_LoopReadLine, CSV 84 | { 85 | Field%A_Index% := A_LoopField 86 | } 87 | DoIt(Field1, Field2, Field3, Field4, Field5) 88 | } 89 | -------------------------------------------------------------------------------- /capture/ahk_gdipp.ahk: -------------------------------------------------------------------------------- 1 | #NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. 2 | ; #Warn ; Enable warnings to assist with detecting common errors. 3 | SendMode Input ; Recommended for new scripts due to its superior speed and reliability. 4 | SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. 5 | 6 | SetTitleMatchMode, 2 7 | 8 | SetView(FontName, FontSize, aa, color) 9 | { 10 | ; Set font settings 11 | Send, view.run_command("set_setting", {{}"setting": "font_size", "value": %FontSize%{}}){Enter} 12 | 13 | Send, view.run_command("set_setting", {{}"setting": "font_face", "value": " 14 | SendRaw, %FontName% 15 | Send, "{}}){Enter} 16 | 17 | Send, view.run_command("set_setting", {{}"setting": "gutter", "value": False{}}){Enter} 18 | 19 | if (color="light"){ 20 | Send, view.run_command("set_setting", {{}"setting": "color_scheme", "value": "Packages/User/Monokai Extended Light_cus.tmTheme"{}}){Enter} 21 | }else{ 22 | Send, view.run_command("set_setting", {{}"setting": "color_scheme", "value": "Packages/User/Monokai Extended_cus.tmTheme"{}}){Enter} 23 | } 24 | 25 | ; Set AA 26 | if (aa="aa1"){ 27 | Send, view.run_command("set_setting", {{}"setting": "font_options", "value": []{}}){Enter} 28 | }else{ 29 | Send, view.run_command("set_setting", {{}"setting": "font_options", "value": ["no_antialias"]{}}){Enter} 30 | } 31 | 32 | Send, {Esc} ; Close console 33 | Sleep, 150 34 | } 35 | 36 | DoIt(codeLen, color, FontName, FontSize, aa) 37 | { 38 | ; Activate sublime window 39 | winactivate, Sublime Text 40 | WinWaitActive, Sublime Text 41 | 42 | ; 0-padded font size to two digits 43 | ; paddedSize := ((strlen(FontSize)<2) ? "0"FontSize : FontSize) 44 | 45 | ; MsgBox, %FontName% %FontSize% %aa% %codeLen% %color% 46 | 47 | 48 | ; Open sublime console 49 | Send, ^!c 50 | 51 | ; Open short code 52 | if (codeLen="short"){ 53 | Send, window.open_file("code_short.txt"){Enter} 54 | }else{ 55 | Send, window.open_file("code_long.jsx"){Enter} 56 | } 57 | 58 | SetView(FontName, FontSize, aa, color) 59 | 60 | ; ss_filename = C:\code\font_compare\capture\ss\ 61 | ; ss_filename = %ss_filename%testwindow.open_file("code_short.txt") 62 | ; MsgBox, %ss_filename% 63 | 64 | FontNameDashed := RegExReplace(FontName, " ", "-") 65 | FontNameDashed := RegExReplace(FontNameDashed, "/", "-") 66 | 67 | FontSizeStr := "" 68 | if (codeLen="long"){ 69 | FontSizeStr := FontSize 70 | }else{ 71 | if (FontSize > 15){ 72 | FontSizeStr := "big" 73 | }else{ 74 | FontSizeStr := "small" 75 | } 76 | } 77 | 78 | Run, c:\code\font_compare\capture\nircmd.exe savescreenshotwin "C:\code\font_compare\capture\ss\%codeLen%_%color%_%FontNameDashed%_%FontSizeStr%_aa2.png" 79 | } 80 | 81 | Loop, read, c:\code\font_compare\capture\ahk_input.csv 82 | { 83 | Loop, parse, A_LoopReadLine, CSV 84 | { 85 | Field%A_Index% := A_LoopField 86 | } 87 | if (Field5="aa1"){ 88 | DoIt(Field1, Field2, Field3, Field4, Field5) 89 | } 90 | } 91 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [Programming font comparison](http://www.s9w.io/font_compare/) 2 | 3 | Compares the most common fixed-width programming fonts. All font samples are from actual screenshots of the font taken under Windows 7 with Sublime Text. 4 | 5 | There is the choice between AA (anti-aliasing) turned off and two other rendering settings: ClearType and gdipp. ClearType is the default for Windows, [*gdipp*](https://code.google.com/p/gdipp/) is an alternative open-source text renderer that aims to "bring to you the effect of text like Mac OS and Linux". This is an optional install for Windows and can not be guaranteed to exactly replicate the rendering of other operating systems. 6 | 7 | Both renderers yield the same result without AA, therefore those three rendering options are combined. Note that the difference between ClearType and gdipp rendering varies between fonts. There are also bitmap fonts that are stored pixel-perfect and therefore should not (and usually can't) be anti-aliased. 8 | 9 | In the **overview** mode you can quickly compare all available fonts. The green/red square is an indicator for the AA mode. Since there is a global AA toggle it will always stay red (off) for bitmap fonts. The checkboxes select fonts to be compared in more detail in the second mode. 10 | 11 | When **comparing**, the code sample is bigger and there is a wider range of sizes to chose from. Size and rendering mode are set for each font individually. There's always just one sample rendered with the font that's currently selected. Switching between fonts can be done either by hovering over the name or using the keyboard hotkeys (1-9). There's also a 2x zoom option for close inspection or people with really high dpi screens. The zoom is filterless without interpolation (1 pixel to 4 pixel). 12 | 13 | The capturing process is automated so requests for fonts or changes to the code sample are welcome. 14 | 15 | ## code sample 16 | 17 | ![code sample image](http://s9w.github.io/font_compare/trimmed/long_light_Consolas_14_aa1.png) 18 | 19 | The code sample was chosen to showcase most common characters and problems with fonts. The characters in the second line under the alphanumerics are: 20 | 21 | - 1: The number one 22 | - I: Big i (Indiana) 23 | - l: Small L (Lambda) 24 | - |: Vertical bar 25 | - L: Big L 26 | 27 | - 8: number eight 28 | - 0: number zero 29 | - O: big O (Oregano) 30 | - o: small O 31 | 32 | - number five 33 | - big S (superman) 34 | 35 | Followed by some brackets, special characters and double underscore among other things. In this sequence there are three different kinds of dashes. The first is a normal dash or "Hyphen-Minus": "-" ([U+002D](http://unicode-table.com/en/002D/)), then an en dash ([U+2013](http://unicode-table.com/en/2013/)), then an em dash ([U+2014](http://unicode-table.com/en/2014/)). 36 | 37 | Then come a number of different quotation marks. I'll list the unicodes to avoid confusion 38 | 39 | - straight double: "q" ([U+0022](http://unicode-table.com/en/0022/)) 40 | - straight single / apostrophe: 'q' ([U+0027](http://unicode-table.com/en/0027/)) 41 | - curly/curved double left and right: �q� ([U+201C](http://unicode-table.com/en/201C/) and [U+201D](http://unicode-table.com/en/201D/)) 42 | - curly/curved single left and right: �q� ([U+2018](http://unicode-table.com/en/2018/) and [U+2019](http://unicode-table.com/en/2019/)) 43 | 44 | The third line has a couple of unicode characters: The plusminus sign, Ellipsis, multiplication sign, middle dot. 45 | 46 | The big code sample contains a **bold** and a *italic* word in the 11th line: `render` is rendered bold, `function` is italic. Of course only if the font supports it. 47 | 48 | ## Font-specific notes 49 | - **Monoid** and **Input** are both highly customizable, offering alternatives for commonly controversial letters. This site features only the default versions. 50 | - **Office Code Pro** and **Meslo** also offer a Dotted Zero version. 51 | -------------------------------------------------------------------------------- /jsx/Fonti.jsx: -------------------------------------------------------------------------------- 1 | var Overview = require('./Overview.jsx'); 2 | var Compare = require('./Compare.jsx'); 3 | 4 | var Fonti = React.createClass({ 5 | getInitialState() { 6 | return({ 7 | mode: "Overview", 8 | theme: "Light", 9 | useAA: "default", 10 | selectedFonts: new Set(["Consolas", "Source Code Pro", "Roboto Mono", "Iosevka", "Fira Mono", "PT Mono", "Monoid"]), 11 | overviewSize: "small" 12 | }); 13 | }, 14 | changeTest(settingName, newValue){ 15 | var newState = {}; 16 | newState[settingName] = newValue; 17 | this.setState(newState); 18 | }, 19 | selectFont: function(fontName){ 20 | var newSelectedFonts = this.state.selectedFonts; 21 | if(fontName === "all"){ 22 | if(this.state.selectedFonts.size === fontList.length){ 23 | newSelectedFonts.clear(); 24 | }else{ 25 | newSelectedFonts = new Set(fontList); 26 | } 27 | } 28 | else{ 29 | if(this.state.selectedFonts.has(fontName)) 30 | newSelectedFonts.delete(fontName); 31 | else 32 | newSelectedFonts.add(fontName); 33 | } 34 | 35 | this.setState({selectedFonts: newSelectedFonts}); 36 | }, 37 | removeFont(fontName){ 38 | var newSelectedFonts = this.state.selectedFonts; 39 | newSelectedFonts.delete(fontName); 40 | this.setState({ 41 | selectedFonts: newSelectedFonts 42 | }); 43 | }, 44 | render: function() { 45 | var content =""; 46 | if(this.state.mode==="Overview"){ 47 | content = ; 55 | } 56 | else if(this.state.mode==="Compare"){ 57 | var selectedFonts = []; 58 | for(let i=0; i; 71 | } 72 | 73 | return ( 74 |

75 |

76 | 82 | 83 | 89 | 90 | {this.state.mode==="Overview"&& 91 | } 98 | 99 | {this.state.mode==="Overview"&& 100 | } 107 |

108 |

109 | {content} 110 |

111 |

112 | ); 113 | } 114 | }); 115 | 116 | var Setting = React.createClass({ 117 | changeSetting(newValue){ 118 | this.props.changeFunction(newValue); 119 | }, 120 | render: function(){ 121 | var thisOuter = this; 122 | var buttons = this.props.choices.map(function(value, i){ 123 | var label = value; 124 | if("labels" in thisOuter.props){ 125 | label = thisOuter.props.labels[i]; 126 | } 127 | return {label}; 131 | }); 132 | 133 | return( 134 |

135 | {this.props.label}: 136 | {buttons} 137 |

138 | ); 139 | } 140 | }); 141 | 142 | React.render( , document.getElementById('container') ); -------------------------------------------------------------------------------- /jsx/Compare.jsx: -------------------------------------------------------------------------------- 1 | var FontImage = require('./FontImage.jsx'); 2 | 3 | module.exports = React.createClass({ 4 | getInitialState() { 5 | var fontConfigs = {}; 6 | for(let i=0; i= 49 && event.which <= 57){ 37 | var fontIndex = event.which - 48 - 1; 38 | if(fontIndex < this.props.selectedFonts.length){ 39 | this.activateFont(this.props.selectedFonts[fontIndex]); 40 | } 41 | } 42 | }, 43 | componentDidMount: function() { 44 | document.addEventListener('keydown', this.onKeyDown); 45 | }, 46 | 47 | componentWillUnmount: function() { 48 | document.removeEventListener('keydown', this.onKeyDown); 49 | }, 50 | render: function(){ 51 | if(this.props.selectedFonts.length===0){ 52 | return( 53 |

No fonts selected

54 | ); 55 | } 56 | 57 | var fontElList = []; 58 | for(let i=0; i 70 | {size+commaStr} 71 | 72 | ); 73 | } 74 | 75 | let aaSettings = []; 76 | aaSettings.push( 77 | 81 | off 82 | ); 83 | if(fontInfos[fontName]["aa1"].indexOf(this.state.fontConfigs[fontName].size)!==-1) { 84 | aaSettings.push( 85 | 89 | default 90 | ); 91 | aaSettings.push( 92 | 96 | gdipp 97 | ); 98 | } 99 | 100 | var hotkeyStr = "( )"; 101 | if(i<9){ 102 | hotkeyStr = "(" + (i+1) + ")" 103 | } 104 | fontElList.push( 105 | 106 | X 109 | 112 | {hotkeyStr} {fontName} 113 | 114 | 115 | {sizes} 116 | 117 | 118 | {aaSettings} 119 | 120 | 121 | ); 122 | } 123 | 124 | var sizeStr = this.state.fontConfigs[this.state.activeFont].size; 125 | var aaStr = this.state.fontConfigs[this.state.activeFont].aa; 126 | 127 | return( 128 |

129 |

130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | {fontElList} 139 | 140 |

(Key) Font

Size

141 |

142 | 143 |

144 | 151 |

152 |

153 | ); 154 | } 155 | }); -------------------------------------------------------------------------------- /jsx/Overview.jsx: -------------------------------------------------------------------------------- 1 | var urls = { 2 | "Anonymous Pro": "http://www.marksimonson.com/fonts/view/anonymous-pro", 3 | "Bitstream Vera Sans Mono": "https://www.gnome.org/fonts/", 4 | "Courier Prime": "http://quoteunquoteapps.com/courierprime/", 5 | "Classic Console": "http://webdraft.hu/fonts/classic-console/", 6 | "DejaVu Sans Mono": "http://dejavu-fonts.org/", 7 | "Dina": "https://www.donationcoder.com/Software/Jibz/Dina/", 8 | "Envy Code R": "https://damieng.com/blog/2008/05/26/envy-code-r-preview-7-coding-font-released", 9 | "Fantasque Sans Mono": "https://github.com/belluzj/fantasque-sans", 10 | "Fira Mono": "https://mozilla.github.io/Fira/", 11 | "FixedSys Excelsior 3.01": "http://www.fixedsysexcelsior.com/", 12 | "Hack": "https://github.com/chrissimpkins/Hack", 13 | "Hermit": "https://pcaro.es/p/hermit/", 14 | "IBM 3270": "https://github.com/rbanffy/3270font", 15 | "Inconsolata-dz": "http://nodnod.net/2009/feb/12/adding-straight-single-and-double-quotes-inconsola/", 16 | "InputMono": "http://input.fontbureau.com/", 17 | "InputMonoCondensed": "http://input.fontbureau.com/", 18 | "Iosevka": "http://be5invis.github.io/Iosevka/", 19 | "Liberation Mono": "https://fedorahosted.org/liberation-fonts/", 20 | "Luculent": "http://eastfarthing.com/luculent/", 21 | "M+ 1m light": "http://mplus-fonts.osdn.jp/mplus-outline-fonts/index-en.html", 22 | "M+ 1m medium": "http://mplus-fonts.osdn.jp/mplus-outline-fonts/index-en.html", 23 | "M+ 1m regular": "http://mplus-fonts.osdn.jp/mplus-outline-fonts/index-en.html", 24 | "Meslo LG L": "https://github.com/andreberg/Meslo-Font", 25 | "Meslo LG M": "https://github.com/andreberg/Meslo-Font", 26 | "Meslo LG S": "https://github.com/andreberg/Meslo-Font", 27 | "Monofur": "http://eurofurence.net/monofur.html", 28 | "Monoid": "http://larsenwork.com/monoid/", 29 | "monoOne": "https://github.com/madmalik/monoOne", 30 | "mononoki": "https://madmalik.github.io/mononoki/", 31 | "NanumGothicCoding": "http://dev.naver.com/projects/nanumfont/download/", 32 | "OCR A Extended": "http://cooltext.com/Download-Font-OCR+A+Extended", 33 | "Office Code Pro": "https://github.com/nathco/office-code-pro", 34 | "Office Code Pro Light": "https://github.com/nathco/office-code-pro", 35 | "Office Code Pro Medium": "https://github.com/nathco/office-code-pro", 36 | "OpenDyslexicMono": "http://opendyslexic.org/", 37 | "PragmataPro": "http://www.fsd.it/fonts/pragmatapro.htm", 38 | "ProFontWindows": "http://tobiasjung.name/profont/", 39 | "ProggyClean": "http://www.proggyfonts.net/", 40 | "Source Code Pro": "http://adobe-fonts.github.io/source-code-pro/", 41 | "Source Code Pro Light": "http://adobe-fonts.github.io/source-code-pro/", 42 | "Source Code Pro Medium": "http://adobe-fonts.github.io/source-code-pro/", 43 | "Tamsyn8x16": "http://www.fial.com/~scott/tamsyn-font/", 44 | "Terminus": "http://terminus-font.sourceforge.net/", 45 | "Ubuntu Mono": "http://font.ubuntu.com/", 46 | "PT Mono": "http://www.paratype.com/public/", 47 | "MonteCarlo": "http://www.bok.net/MonteCarlo/", 48 | "Mensch": "http://robey.lag.net/2010/06/21/mensch-font.html" 49 | }; 50 | 51 | function isInArray(array, element){ 52 | return array.indexOf(element) !== -1; 53 | } 54 | 55 | var FontImage = require('./FontImage.jsx'); 56 | 57 | module.exports = React.createClass({ 58 | selectFont(fontName){ 59 | this.props.selectFont(fontName); 60 | }, 61 | render: function(){ 62 | var font_rows = []; 63 | for(let i=0; i{fontName}; 84 | }else{ 85 | fontElement = {fontName}; 86 | } 87 | 88 | font_rows.push( 89 | 90 | {fontElement} 91 | 92 | {(aaMode==="aa0")?"off":"on"} 93 | 94 | 95 | 100 | 101 | 102 | 109 | 110 | 111 | ) 112 | } 113 | 114 | return( 115 | 116 | 117 | 118 | 119 | 120 | 127 | 128 | 129 | {font_rows} 130 | 131 |

Font

121 | 126 |

132 | ); 133 | } 134 | }); 135 | -------------------------------------------------------------------------------- /capture/generate_ahk_input.py: -------------------------------------------------------------------------------- 1 | import json 2 | 3 | # Some fonts have bitmap versions for small sizes and tt versions for bigger sizes. Bitmap fonts 4 | # can't have aa, tt can. So the combinations of font size and aa mode has to bet set independently. 5 | 6 | # For the overview mode we need font samples that should be the same length. Unfortunately there's 7 | # sometimes little correlation between the size setting and the actual size. So the default size 8 | # has to be set manually for many fonts. 9 | 10 | fonts_names = [] 11 | font_infos = {} 12 | 13 | font_sizes_default = { 14 | "aa0": [8, 9, 10, 11, 12,14, 20], 15 | "aa1": [8, 9, 10, 11, 12,14, 20] 16 | } 17 | 18 | 19 | def add_font(name, default_size_small=12, default_size_big=20, aa_sizes=font_sizes_default): 20 | fonts_names.append(name) 21 | font_info = dict(aa_sizes) 22 | font_info["defaultSmall"] = default_size_small 23 | font_info["defaultBig"] = default_size_big 24 | font_infos[name] = font_info 25 | 26 | 27 | add_font(name="Anonymous Pro", default_size_small=14, default_size_big=22, aa_sizes={"aa0": [7,8,9,10,11,12,14,22], "aa1": [11,12,14,22]}) 28 | add_font(name="Bitstream Vera Sans Mono") 29 | add_font(name="Consolas", default_size_small=14, default_size_big=22, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 22],"aa1": [8, 9, 10, 11, 12,14, 22]}) 30 | add_font(name="Courier Prime") 31 | add_font(name="Classic Console", default_size_small=15, aa_sizes={"aa0": [15], "aa1": []}) 32 | add_font(name="DejaVu Sans Mono") 33 | add_font(name="Dina", default_size_small=10, aa_sizes={"aa0": [8,9,10], "aa1": []}) 34 | add_font(name="Droid Sans Mono") 35 | add_font(name="Envy Code R", default_size_small=14, default_size_big=22, aa_sizes={"aa0": [8, 9, 10, 11, 12, 14,22],"aa1": [8, 9, 10, 11, 12, 14,22]}) 36 | add_font(name="Fantasque Sans Mono", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 23],"aa1": [8, 9, 10, 11, 12,14,23]}) 37 | add_font(name="Fira Mono") 38 | add_font(name="FixedSys Excelsior 3.01", default_size_small=12, aa_sizes={"aa0": [12], "aa1": []}) 39 | add_font(name="Hermit", default_size_small=13, aa_sizes={"aa0": [8, 9, 10, 11, 12,13,14, 20],"aa1": [8, 9, 10, 11, 12,13,14, 20]}) 40 | add_font(name="Inconsolata-dz") 41 | add_font(name="Iosevka", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8,9,10,11,12,14,23], "aa1": [8,9,10,11,12,14,23]}) 42 | add_font(name="Liberation Mono") 43 | add_font(name="Luculent", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 23],"aa1": [8, 9, 10, 11, 12,14, 23]}) 44 | add_font(name="Luxi Mono") 45 | add_font(name="M+ 1m regular", default_size_small=15, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14,15, 23],"aa1": [8, 9, 10, 11, 12,15,15, 23]}) 46 | add_font(name="M+ 1m medium", default_size_small=15, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14,15, 23],"aa1": [8, 9, 10, 11, 12,15,15, 23]}) 47 | add_font(name="M+ 1m light", default_size_small=15, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14,15, 23],"aa1": [8, 9, 10, 11, 12,15,15, 23]}) 48 | add_font(name="Menlo") 49 | add_font(name="Mensch") 50 | add_font(name="Meslo LG S") 51 | add_font(name="Meslo LG M") 52 | add_font(name="Meslo LG L") 53 | add_font(name="Monofur", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 23],"aa1": [8, 9, 10, 11, 12, 14,23]}) 54 | add_font(name="Monoid", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 23],"aa1": [8, 9, 10, 11, 12,14,23]}) 55 | add_font(name="monoOne", default_size_small=13, aa_sizes={"aa0": [8, 9, 10, 11, 12,13,14, 20],"aa1": [8, 9, 10, 11, 12,13,14, 20]}) 56 | add_font(name="MonteCarlo", default_size_small=10, aa_sizes={"aa0": [10], "aa1": []}) 57 | add_font(name="OCR A Extended") 58 | add_font(name="Office Code Pro Light") 59 | add_font(name="Office Code Pro") 60 | add_font(name="Office Code Pro Medium") 61 | add_font(name="OpenDyslexicMono", default_size_small=10, default_size_big=16, aa_sizes={"aa0": [8, 9, 10, 11, 12, 16],"aa1": [8, 9, 10, 11, 12, 16]}) 62 | add_font(name="PragmataPro", default_size_small=14, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14, 23],"aa1": [8, 9, 10, 11, 12,14, 23 63 | ]}) 64 | add_font(name="ProFontWindows", default_size_small=14, default_size_big=24, aa_sizes={"aa0": [8,10,11,12,14,24], "aa1": [8,10,11,12,14,24]}) 65 | add_font(name="ProggyClean", default_size_small=9, aa_sizes={"aa0": [9], "aa1": []}) 66 | add_font(name="PT Mono") 67 | add_font(name="Roboto Mono") 68 | add_font(name="Roboto Mono Light") 69 | add_font(name="Roboto Mono Medium") 70 | add_font(name="Source Code Pro Light") 71 | add_font(name="Source Code Pro") 72 | add_font(name="Source Code Pro Medium") 73 | add_font(name="Tamsyn8x16", default_size_small=10, aa_sizes={"aa0": [10], "aa1": []}) 74 | add_font(name="Terminus", default_size_small=14, default_size_big=24, aa_sizes={"aa0": [10,11,12,14,24], "aa1": []}) 75 | add_font(name="Ubuntu Mono", default_size_small=15, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,15, 23],"aa1": [8, 9, 10, 11, 12,15, 23]}) 76 | add_font(name="InputMono", default_size_big=19, aa_sizes={"aa0": [8, 9, 10, 11, 12, 19],"aa1": [8, 9, 10, 11, 12, 19]}) 77 | add_font(name="InputMonoCondensed", default_size_big=19, aa_sizes={"aa0": [8, 9, 10, 11, 12, 19],"aa1": [8, 9, 10, 11, 12, 19]}) 78 | add_font(name="Hack", default_size_small=13, aa_sizes={"aa0": [8, 9, 10, 11, 12,13,14, 20],"aa1": [8, 9, 10, 11, 12,13,14, 20]}) 79 | add_font(name="Andale Mono") 80 | add_font(name="Lucida Console") 81 | add_font(name="mononoki", default_size_small=13, default_size_big=21, aa_sizes={"aa0": [8, 9, 10, 11, 12,13,14,21],"aa1": [8, 9, 10, 11, 12,13,14,21]}) 82 | add_font(name="NanumGothicCoding", default_size_small=15, default_size_big=23, aa_sizes={"aa0": [8, 9, 10, 11, 12,14,15,23],"aa1": [8, 9, 10, 11, 12,14,15,23]}) 83 | add_font(name="Anka/Coder") 84 | add_font(name="SF Mono", aa_sizes={"aa0": [10, 11, 12,14, 20],"aa1": [10, 11, 12,14, 20]}) 85 | add_font(name="Space Mono") 86 | add_font(name="IBM 3270", default_size_small=12, default_size_big=22, aa_sizes={"aa0": [11,12,16,22],"aa1": [11,12,16,22]}) 87 | 88 | inputs = [] 89 | 90 | for font_name in fonts_names: 91 | font_info = font_infos[font_name] 92 | for theme in ["light", "dark"]: 93 | code_len = "long" 94 | for aa in ["aa1", "aa0"]: 95 | for size in font_info[aa]: 96 | input = [",".join([code_len, theme, font_name, str(size), aa]) + "\n"] 97 | inputs.extend(input) 98 | 99 | code_len = "short" 100 | for aa in ["aa1", "aa0"]: 101 | size = font_info["defaultSmall"] 102 | if font_info[aa] and size >= font_info[aa][0] and size <= font_info[aa][-1]: 103 | input = [",".join([code_len, theme, font_name, str(size), aa]) + "\n"] 104 | inputs.extend(input) 105 | 106 | size = font_info["defaultBig"] 107 | if size in font_info[aa]: 108 | input = [",".join([code_len, theme, font_name, str(size), aa]) + "\n"] 109 | inputs.extend(input) 110 | 111 | with open("ahk_input.csv", "w", encoding="utf-8") as f: 112 | f.write("".join(inputs)) 113 | 114 | with open("../font_info.js", "w", encoding="utf-8") as f: 115 | f.write("var fontList = {};\n".format(json.dumps(sorted(fonts_names, key=str.lower), indent="\t"))) 116 | f.write("var fontInfos = {};".format(json.dumps(font_infos, indent="\t"))) 117 | --------------------------------------------------------------------------------