Have Dyslexia? Make Coding Easier In Visual Studio Code

Use OpenDyslexic Font With Visual Studio Code

If, like me, you suffer from dyslexia and sometimes find it hard to read 📕👨‍💻❓ your code using the standard monospaced font used by your IDE, then the below steps might be of interest to you.

What Is The OpenDyslexic Font?

Wikipedia provides some background to the font.

"OpenDyslexic is a free typeface/font designed to mitigate some of the common reading errors caused by dyslexia, though its benefits have been questioned in scientific studies. The typeface was created by Abelardo Gonzalez, who released it through an open-source license. The design is based on that of DejaVu Sans, also an open-source font."

Download OpenDyslexic Font

Firstly, you can download the awesome free OpenDyslexic font if you haven't already from the following link:-

https://www.opendyslexic.org/

Once you have the OpenDyslexic Font product, then download the OpenDyslexic Mono zip file (monospaced fonts work best when coding).

Note: A monospaced font's letters and characters each occupy the same amount of horizontal space. These are often referred to as fixed-width fonts.

Install OpenDyslexic Mono Font

Note: These steps document how to install the font via Windows 10. Feel free to share in the comment section details on how to install on other operating systems.

Before installing the OpenDyslexic Mono font you'll need to unzip it. Once unzipped, double click the OpenDyslexicMono-Regular.otf file and this will open the font in Windows Font Viewer. Now click the Install button.

Setup Visual Studio Code

Open Visual Studio Code and from the File menu choose Preferences, Settings or use the keyboard shortcut Ctrl + , (Cmd + , on Mac). These font changes can be made for the user or workspace depending on your preference. At this point you'll need to make sure the correct tab is selected.

Type font for the search term and this will now filter the settings to only show those that concern fonts. Find the "Editor: Font Family" (this should be the first setting displayed). In the "Font Family" input box add OpenDyslexicMono to the beginning of the text.

OpenDyslexicMono, Consolas, 'Courier New', monospace

Note: Changes are automatically saved.

Visual Studio Code is making the following change to the settings file behind the scenes.

{
    ...
    "editor.fontFamily": "OpenDyslexicMono, Consolas, 'Courier New', monospace"
}

Below is an example of what to expect when a file is opened using the OpenDyslexic font.

I've found the OpenDyslexic Mono font helpful and I hope it makes a difference for other developers too. It would be good to hear your experiences of using it and whether it makes life any easier via the comments.

Enjoy and happy coding!!!💻

Comments

[K]

I#m not dyslexic, but I like OpenDyslexic it feels more comfortable to read, use it on my Kindle all the time.

Nice to see that there is a monospaced version, will try it on VSCode :)

[Carl Saunders]

I'm currently using it on the Kindle as well, definitely makes it easier and I'm less likely to lose concentration.

[Ali Rizvi]

It should be noted not all dyslexic people find this font comfortable. A couple of close friends, who are also dyslexic claim this font makes it feel worse or harder to read with.

Effectively, your mileage may vary

[Jordon Replogle]

I'm dyslexic, and I've tried using this font and I just can't get used to it.

[Reese Poirier]

I've had similar experiences with "colorblind friendly" editor color themes. The ones I've tried are all worse for me than most standard themes.

Unfortunately accessibility isn't often one size fits all.

[Carl Saunders]

Unfortunately there's no one size fits all solution, but it can help some.

[Adam Crockett 🌀]

I use a really high contrast theme based on Adobe brackets dark. I will take a look at this font. Might work for me.

[Carl Saunders]

I'm currently using the Default Dark+ theme, but might have a look at the Adobe Brackets dark theme.

marketplace.visualstudio.com/items...

[Adam Crockett 🌀]

Does anyone work with a screen reader. Sometimes I leave it open and code with it, that helps me on bad days.

[Andrew Bone]

That's how I read books generally, I buy the audiobook too and listen to it, while following along on paper, if I'm really struggling.

[Mitch Muenster]

intresting post. As a dyslexic person my self I prefer to use the Fluent Calibri font. It is not a one size fits all solution but it also helps with presenting for big rooms and showing off code. I have concerns with the way this font makes some lines thicker and thinner, it could potentially cause issues. microsoft.com/en-us/download/detai... is the link to get the font for windows, unix/Linux an dnd mobile phone.

Glad you found something that works for you.

[halitfirat]

That was helpful! There is something to Fluent Calibri according to a study:

...
In conclusion, we demonstrated that low-progress readers are 7% more
efficient in reading text in Dyslexie compared with Arial, matched on letter display
size. However, when the spacing settings for Arial are matched to Dyslexie, the
advantage disappears. Therefore, the benefit of Dyslexie seems to stem fully from
its specific spacing settings. In contrast, the font’s hallmark letter shapes, which are
intended to be more distinct than those in standard fonts, do not provide a benefit.
In fact, our analyses show that compared with Arial, the inter-letter distinctiveness
of Dyslexie is actually lower. The practical implication is that to directly increase
the average reading efficiency of low-progress readers one can simply change
the font’s spacing settings. There is no need to alter the shape of the letters.
...

But for me the letter spacing in Fluent Calibri was a bit too much. So i had to decrease it a bit.

[Mitch Muenster]

Indeed, that is always the challenge for designers and developers when it comes to things like Dyslexia which can show many different ways, there is no one magic bullet. I know a lot of people who have great success with the fonts listed in this article. There are always more factors that contribute to readability, comprehension and processing of text then besides the font its self such as colors, color contrast between font and background, spacing between font and other design elements, etc. and this is not even taking into personal preferences when reading fonts or how a platform may render a font and what that platform allows for or constricts from the fonts file to display on screen. for example I have had some IDE's not respect the spacing set about in the font file, and it causes it to display improper or without any of the expected spacing and seemed to force its own spacing intent on the users font regardless of what was chosen much less with the respective OS chooses to do.

[David L. Harper]

I'm not really a software developer, but I signed up to say I really dig the font! The font has a ghost hunter aesthetic to it.

[zikkurat10]

Thank You, deadlybyte, for your passion and help to solve that problem easy and quickly. Wish your personal grow and luck in life. Thank you very much!