There is no visual separation between the gutter and the editing pane

[eterevsky]

Because the gutter is not visually separated from the editing pane, it is very hard to tell, where the first column is, and whether the cursor is currently at the start of the line, or not.

[mikemcbride]

Personally I like the look, and I have to believe they intend for it to look that way. It's easy enough to just add something like the following to your own stylesheet.less for a visual cue:

.gutter {
  border-right: 1px solid rgba(255,255,255,0.1);
}

Just my $0.02

[lee-dohm]

I'm pretty certain this is intentional also. If it is intentional and since a workaround is relatively simple, I'm inclined to mark this wontfix. I'll wait until @simurai lets us know his thoughts though.

[simurai]

Yes, this is intentional. Personally, I have the

• [x] Show Indent Guide

enabled in the settings. But if not, then yeah, it's kinda hard to tell if a line is indented or not.

In your styles.less file, you could:

Border

Add a border (like @mmcbride1007 suggested):

@import "syntax-variables";
atom-text-editor::shadow .gutter {
  border-right: 1px solid @syntax-indent-guide-color;
}

Background

Add a background color. Maybe

@import "syntax-variables";
atom-text-editor::shadow .gutter {
  background-color: lighten(@syntax-background-color, 5%);
}

[zwpaper]

@simurai I tried the solution, but I got two lines after the line number like the pic, could you help me please?

[simurai]

@zwpaper You probably have a package installed that adds a second gutter, like linter? Using the .gutter-container instead should only show one line:

atom-text-editor::shadow .gutter-container {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}

[zwpaper]

@simurai Exactly! Thanks so much. I use .gutter-container and it works. then I try to disable the linter, .gutter also works!