Giter Site home page Giter Site logo

vs-code-e-ink-theme's Introduction

E-Ink Theme for Visual Studio Code/VSCodium

A light Visual Studio Code color theme optimized for usage with black-and-white E-Ink monitors

This is a purely black-and-white color theme designed to look and feel good on E-Ink monitors (such as Dasung Paperlike http://www.dasungtech.com/).

The theme distinguishes between (mostly) javascript keywords by marking them in bold font. Comments are displayed in greyed-out font while the contrast between regural text and background has been cranked-up to maximum in order to work nicely with the e-ink medium.

Installation

In the command palette (ctrl/cmd + shift + p) type Install Extension and search for E-Ink 2 (or for E-Ink if you use VSCodium).

Example

Example

Notes

I recommend you use this along with the amazing Fira Code font.

vs-code-e-ink-theme's People

Contributors

mufanza avatar generalredneck avatar

Stargazers

Frederick Morlock avatar  avatar 0xabad1dea (Melissa Elliott) avatar  avatar  avatar John Mahoney IV avatar Costis Panagiotopoulos avatar  avatar  avatar Mark Witt avatar gaoqiang avatar Grigorii Horos avatar blurSong avatar  avatar MuChen avatar  avatar  avatar Alexey avatar kev zettler avatar Daniel Kao avatar Dylan Garrett avatar Hector Kemp avatar Johnny Sung avatar Geordie Powers avatar Muhammad Rashid avatar  avatar fujimo-t avatar  avatar Tu Hanh Nguyen avatar

Watchers

 avatar MuChen avatar

vs-code-e-ink-theme's Issues

missing theming for inlay hints

Possible to add theming for inlay hints?

Maybe something like the below

"editorInlayHint.background": "#f4f4f4",
"editorInlayHint.foreground": "#888888"

^ not sure if it works well on e-ink displays, please adjust.

Do you use this on Eink?

Hey there,
First, Thank you for putting this theme together. I use this theme explicitly on my Dasung 25.3 paperlike U. There are several difficulties I've found when using it as my daily driver though and thought it would be good to collaborate with you on some of these and discuss how you work with your own theme.

20240209_124908-min

I have to use Graphic mode, Text mode just blacks stuff out and the greys make unclear text, which I'm ok with, I work in graphics mode most of the time. Video mode's quality is just too bad.

Here are a list of things I've noticed:

  • Terminal's color contrast are just bad. You can see the table above and how the various colors look on eink. Here's what they would look like on color. We should probably do some testing around these values to optimize for Eink
    image

  • The inline blames are just barely legible, they are so faint. I can increase the contrast but that affects with visibility of other things.

  • The popups are all that mid Grey color. It makes it hard to read any of the suggestions. I recommend we have a dark bold border and white background as that default to make that all stand out. The example shows a commit in the popup with my recent diff changes which I didn't know would be part of that... Those colors I chose for Diffs don't work on the grey at all. The popup doesn't show JUST commits though. It's used for code documentation too.

  • The tabs in the workspace are various shades. So if you have a inactive tag on an inactive pane, you have a super dark tab that you just can't read the filename on very well.

  • I had to set custom debugging colors, because the defaults are SUPER LIGHT all the way across the board... Except when you hover over an item. I have some starting colors as

           "debugTokenExpression.boolean": "#000000",
           "debugTokenExpression.name": "#333333",
           "debugTokenExpression.number": "#000000",
           "debugTokenExpression.string": "#888888",
           "debugTokenExpression.value": "#888888",
    

    20240209_130907-min

  • The highlighting on the left hand explorer bar makes it where nearly can't see the icon you have selected.

  • The buttons in the Extensions store that say "Install" or "Reload" are just pretty much black.

  • The options button is missing the top of it's border.
    20240209_131636-min

  • highlighting in the text editor is a little dark. Maybe there is a better treatment?

The script I used for the bash colors is as follows:

#!/bin/bash
#
#   This file echoes a bunch of color codes to the
#   terminal to demonstrate what's available.  Each
#   line is the color code of one forground color,
#   out of 17 (default + 16 escapes), followed by a
#   test use of that color on all nine background
#   colors (default + 8 escapes).
#
#   Copied from http://tldp.org/HOWTO/Bash-Prompt-HOWTO/x329.html

T='gYw'   # The test text

echo -e "\n                 40m     41m     42m     43m\
     44m     45m     46m     47m";

for FGs in '    m' '   1m' '  30m' '1;30m' '  31m' '1;31m' '  32m' \
           '1;32m' '  33m' '1;33m' '  34m' '1;34m' '  35m' '1;35m' \
           '  36m' '1;36m' '  37m' '1;37m';
  do FG=${FGs// /}
  echo -en " $FGs \033[$FG  $T  "
  for BG in 40m 41m 42m 43m 44m 45m 46m 47m;
    do echo -en "$EINS \033[$FG\033[$BG  $T  \033[0m";
  done
  echo;
done
echo

Paperlike Color?

Do you plan to add specific theme for Paperlike Color monitor text mode?

Push latest changes to VS Code marketplace

Hey mate, I updated my changes manually for months of using this theme to make the side paneling more light-themed. I checked this repo to see that you have made these changes to the side paneling to make it actually a true light-theme. However, these latest commits aren't in the version that has been pushed up to the VS Code Marketplace. Can you do that? Thank you!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.