Atom is so powerful that it blows my mind


I feel extremely stupid, but I have tried a bunch of rules in my .atom/styles.less, and nothing happens. I tried closing and reopening, and still nothing. Is there anything I am missing?


I was just about thinking the exact same thing.

While it’s good for atom to be easy ‘hackable’, it’s quite obvious the ‘hidden’ characters should be low opacity by default to prevent distraction or a messy editor.


Have you checked the JavaScript console in the developer tools? IIRC I had errors there at some point, when I used @base03 as in one of the examples posted (probably because I’m using a later Atom).

Show invisibles only in selected text


Indeed, my variable @base03 was undefined.


So I’m trying to get @thgaskell’s hack working, but @base03 doesn’t seem correct anymore. I’m looking instead at something like @syntax-background-color or @base-background-color. But when I use either for some reason the invisibles just show up white - it’s acting like the variables form your ui theme and and syntax theme aren’t available in styles.less for some reason. Anyone know what I’m doing wrong?

Also, the new selector seems to be atom-text-editor::shadow .invisible-character not .editor .invisible-character.

Even when it does work through it seems like indentation guides get styled by this change as well. Realistically the only good solution to this probably lies with something like this: Show invisibles only in selected text


This works for now:

@import "syntax-variables";
atom-text-editor::shadow .invisible-character {
	color: @syntax-background-color;


The dots aren’t everywhere:

version atom :
••••channel =

version sublime :

I use this dots for indent. But i use them for non-breaking space too.
I would like to detect the non breaking point easily. Like a warning "you are doing a mystake dude ! ". "Thx Atom you rox ! :wink: "
If I copy/paste a text and there is a non-breaking space in it, the point won’t be print like normal space.
But maybe you have another solution like non-breaking space have a red background.


What is the syntax-theme you use for css?


There is a deprecation warning when atom-text-editor::shadow is used:
Starting from Atom v1.13.0, the contents of atom-text-editor elements are no longer encapsulated within a shadow DOM boundary. This means you should stop using :host and ::shadow pseudo-selectors, and prepend all your syntax selectors with syntax–. To prevent breakage with existing style sheets, Atom will automatically upgrade the following selectors:

atom-text-editor::shadow .invisible-character => atom-text-editor.editor .invisible-character
Automatic translation of selectors will be removed in a few release cycles to minimize startup time. Please, make sure to upgrade the above selectors as soon as possible.


I think it makes sense also to post a link to Github issue related to this –