Help us understand the problem. What is going on with this article?

AtomのMarkdownプレビューをGitHubスタイルにしたり、カスタマイズしたりする。

More than 3 years have passed since last update.

コメントをいただいたので反映しました。
以下のかんたんな手順でGitHubスタイルに準拠できます。

  1. Settingsを開く。
  2. パッケージというサブメニューを選択する。
  3. markdown-previewを検索して、Settingsボタンを押す。
  4. Use GitHub.com styleにチェックする。

以上です。
カスタマイズをしたい人というのは、以下の記事を参照してください。


AtomのUI themeの何を選択するとしても背景色は黒系統で運用するわけじゃないですか。
そこでMarkdownプレビューすると背景色が黒いけど、プレビューは白背景で黒文字にしたいわけじゃないですか。
どうすればいいんですか?

ということを会社の人に言われて、CSS書きました。

Markdownのプレビューがこうなります。(AtomのREADME参考にちょっと追記してます。)

Kobito.8Htn0r.png

styles.less に以下のコードを追記します。

styles.less
.markdown-preview {
  background: white !important;
  p, h1, h2, h3, h4, h5, h6, li, th, td, strong {
    color: black !important;
  }
}

Settings - Themesからyour stylesheetのリンクをクリック。あるいはSettings - Open config folderから.atom ディレクトリ内にあるstyles.lessを選択。

背景を白く。最低限のテキストを黒くしてるだけ(リンクなどは変更なし)です。

みなさまAtomに移行しましょーというメッセージ込です。

naru0504
UXデザイナーです。 プログラミングなんて一切わかりません( ◠‿◠ )
opt
"INNOVATION AGENCY" を標榜するインターネット広告代理店。エンジニア組織 "Opt Techonologies" を中心にアドテクetc...に取り組んでいます。
https://opt-technologies.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away