たった1行のCSSでこれなら簡単！すでに制作済みのWebサイト・スマホアプリをダークモードに対応させる方法 | コリス

2020/08/16 177 users コリス dark CSS ダークモード スマホアプリ

「たった1行のCSS」とは、prefers-color-scheme: dark;の紹介ではありません。 Webサイトやスマホアプリのさまざまな要素すべてをダークモード用にカラーを変換するたった1行のCSSを紹介します。 すでに制作済みのWebサイトやスマホアプリをダークモード対応にしたい時だけでなく、ユーザースタイルシートとして利用する... 続きを読む

CSSのメディアクエリ「prefers-color-scheme」でダークモード対応にする方法と注意点 | コリス

2019/10/29 52 users コリス iPhone CSS メディアクエリ ダークモード

iPhoneやAndroidでもダークテーマが採用され、ダークモードに対応するWebサイトやスマホアプリが増えてきました。 ほんの数行のCSSのみでダークモードに対応する方法と注意点を紹介します。 Dark mode in a website with CSS by Tom Brow 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にラ... 続きを読む

Webでダークモードに対応する | written by @axross

2019/08/26 49 users ダークモード web iOS MacOS 紺色

このウェブサイトをダークモードに対応させました。ライトモード (通常) では白い背景ですが、ダークモードで見ると紺色の背景になっているのが確認できると思います。 LightDark ダークモードはすでに主要なすべてのOS (Windows、Android、iOS、macOS) にあり、その設定はCSSのメディアクエリ prefers-color-scheme に... 続きを読む

prefers-color-scheme を用いた Dark Mode 対応と User Preference Media Features | blog.jxck.io

2018/11/09 66 users メディアクエリ created_at じい デザイン 問題

created_at: 2018-11-10 updated_at: 2018-11-10 tags: [media query,dark mode,css] Intro macOS Mojava は OS レベルで Dark Mode に対応した。 しかし、 Web コンテンツは依然として白背景黒文字ベースのデザインが多く、結果ブラウザの中だけ眩しいという問題がある。 Safari TP69 では、これにメディアクエリで対応... 続きを読む