'Atom Code Editor. Why is my code not in color?

I started using the Atom Code editor recently. During my last project, I installed a couple of tools to make my coding more interactive.

One of the features added color to my code which makes it easier to read.

However, I started a new project today and the code is all white on a dark background. How do I color my code?

I have attached two screenshots of the colored code and the non colored code just to illustrate what I mean but its pretty straightforward.



Solution 1:[1]

Atom might not be recognizing the syntax of your code immediately. Check the bottom right corner of the screen to make sure atom has the correct language/file extension selected. You can manually select this if atom doesn't do it automatically. You might also need to install some new packages if atom isn't recognizing your code.

Solution 2:[2]

Use ctrl+shift+l to open the language selector, and select the auto-detect option.

Solution 3:[3]

I had the same problem. Try switching to HTML(Go) in the bottom right corner. It's between UTF-8 and Github.

Solution 4:[4]

The current version of Atom I'm running as of Oct 2018 seems to identify code by tags. So even if I select HTML manually, unless the file has <html> tag, it still doesn't mark it as HTML. I just add redundant commented out <!-- <html> --> tag in the beginning of the file and it does the trick.

Solution 5:[5]

Why isn't anybody mentioning the file extension?

Your "Project Greg.html" is HTML. But "Random Quote Machine" has NO extension.

This is why the syntax isn't showing.

Solution 6:[6]

You may need to install a new package for Atom. You can find different language packages for Atom here: https://atom.io/packages

For example, for React.js, install the react package.

In your terminal, type this command: apm install react

More info for react packages:
https://atom.io/packages/react
https://orktes.github.io/atom-react/

Solution 7:[7]

Check the bottom right corner of the screen to make sure atom has the correct language/file extension selected

Solution 8:[8]

If your file has extension HTML or ejs (.html, .ejs) language-ejs package can 't recognize those file.In the bottom right corner of the screen, change the HTML to ejs or javascript, then the atom can recognize that the code your write is parts of ejs. NOte, you need to install language -ejs package first.

Solution 9:[9]

Follow the steps:-

  1. File->Settings
  2. Select 'Core' from left pane.
  3. Change color profile to "Use sRGB color profile".
  4. Restart 'Atom'.

Solution 10:[10]

Make sure the beginning identifies the file as a html document. I had this problem and just added <!DOCTYPE html> as the very first line and it worked.

Solution 11:[11]

Maybe this will helps for someone, but if you tab once this line: <!DOCTYPE html> and it will show coloured HTML code

Solution 12:[12]

If the langage set is already the right one,and the code stays grey unless you directly edit it, just try setting another langage then switch back. It worked for me after Atom refused to color an entire copy-pasted HTML page.

Solution 13:[13]

I am a very newbie but wanna share what worked for me. Please don't judge me strictly. Since I work only in Python, it is very convenient to change the grammar to Python every time. How to make it automatic:

  1. File->Settings (or use Ctrl+Comma)
  2. Click Open config folder
  3. Click on styles.less
  4. After all the code, write exactly this source.python {

}

  1. Save
  2. Restart Atom.
  3. You're all set.

Hope this was helpful, couldn't find this solution elsewhere.

Solution 14:[14]

The !DOCTYPE html did not change the color for me but in the bottom right is :

CRLF UTF-8 HTML GitHub Git(0) menu options. I selected HTML and in the popup window selected AUTO. The color returned instantly.