CODEWITHSUNDEEP
atom-editor
Aron Tesfay
Aron Tesfay

Reputation: 313

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.

Upvotes: 19

Views: 72594

Answers (14)

Yaro-Maro
Yaro-Maro

Reputation: 51

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.

Upvotes: 4

Lance Orloff
Lance Orloff

Reputation: 1

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.

Upvotes: 0

Moose LT
Moose LT

Reputation: 91

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

Upvotes: 9

Rinzler
Rinzler

Reputation: 11

Follow the steps:-

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

Upvotes: 1

Rudulph Val Nario
Rudulph Val Nario

Reputation: 23

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.

Upvotes: 1

Maxim Zaliubovskiy
Maxim Zaliubovskiy

Reputation: 1

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.

Upvotes: 0

khn Rzk
khn Rzk

Reputation: 1292

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

Upvotes: 1

yizic
yizic

Reputation: 11

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.

Upvotes: 0

Swetha J
Swetha J

Reputation: 101

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

Upvotes: 10

Matīss
Matīss

Reputation: 11

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

Upvotes: 0

Normajean
Normajean

Reputation: 1275

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.

Upvotes: 0

Arthur Tarasov
Arthur Tarasov

Reputation: 3791

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.

Upvotes: 3

kenecaswell
kenecaswell

Reputation: 7598

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/

Upvotes: 1

Zubair
Zubair

Reputation: 726

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.

Upvotes: 45

Related Questions