Notionのタイムラインビューの土日に色をつける方法

こんにちは、チャベスと言います。

今回は、以下のようにタイムラインビューで土日に色をつける方法を解説します。

色をつけるには、Chrome 拡張機能の「Stylus」を使います。Stylus の使い方については、以下を参考にしてください。

Notionの見た目をStylusで自由に改造する - Notionラボ

Notionの見た目を自由に変更する方法を解説する記事。StylusというChrome拡張機能を使い、見出しのデザイン変更、データベースのヘッダー色変更、テキストリンクの色変更などができる。注意点として、ダークモードとライトモードの切り替えでデザインが崩れることがある、他人に共有する場合は同じ設定をしてもらう必要がある、Notionのアプリ版では変更できないということが挙げられる。

https://notion-lab.jp

Stylus の設定画面で、以下のように CSS を指定します。

.notion-timeline-view > .notion-selectable.notion-collection_view-block > div:first-child div {
  background: linear-gradient(90deg, #EBF3FE 0%, #EBF3FE 50%, #FFEBE9 50%, #FFEBE9 100%)!important;
  display: flex;
  justify-content: center;
  align-items: center;
}

これで土日にのみ色がつきます。もし色を変えたい場合は、上記の#EBF3FEや#FFEBE9のカラーコードを変更してみてください。

Notion-Coloring-TimeLineViwe

https://arc.net

Arc ブラウザを使っている場合でも、上記と同じように Stylus で実現することができますが、Arc には「Boost」機能というデフォルトで備わっている機能で、Stylus と同じことが実現できます。また、Boost 機能では設定をシェアすることができるので、以下のリンクから設定をインストールすれば、タイムラインへの色付けができます。Arc を使っている方はぜひ試してみてください。

Arc | 404

https://arc.net

今回はタイムラインビューの土日の色を変更する方法を解説しました。今回のカスタマイズのネタは、Rei｜Notion公式アンバサダー さんと モリヲ | Notionコンサル🛠 さんに教えてもらいました。ありがとうございました！

💡

初学者からでも安心して Notion を学べるオンラインコミュニティ「Notion 大学」を運営中。Notion コミュニティとしては国内最大規模で、会員数は現在200名以上となっております。

• 分からないことは24時間チャットツールでいつでも質問できる
• コミュニティ内の限定勉強会でタスク管理や知識管理術が学べる
• 1から学べる Notion 学習ロードマップで初心者からでも学習可能
• Notion 大学限定の学習動画が100本以上
• 定期的に開催している有料セミナーへの無料参加券
• 過去の有料記事・有料テンプレートが全て閲覧可能

コンテンツや特典盛りだくさんです。参加方法は下記の記事をご覧ください。

　

Notion 大学とは？特徴・料金・参加方法について解説します - Notionラボ

Notion 大学の参加用ページ

https://notion-lab.jp