# 変数を使ったDiscourseのスタイリング：よりシンプルなセマンティクスのための事例

**URL:** https://meta.discourse.org/t/styling-discourse-with-variables-a-case-for-simpler-semantics/378001
**Category:** Development
**Created:** [2025 年 8 月 9 日午後 6:31 UTC](https://meta.discourse.org/t/styling-discourse-with-variables-a-case-for-simpler-semantics/378001 "2025-08-09T18:31:28Z")
**Posts on this page:** 1
**Showing post:** 3

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [2025 年 8 月 10 日午前 9:03 UTC](https://meta.discourse.org/t/styling-discourse-with-variables-a-case-for-simpler-semantics/378001/3 "2025-08-10T09:03:14Z")

</div>

> [@RGJ](#):
>
> まあ、CSSは自然に変数を使わないものだと思います

変数を使用するのにはもっともな理由があります。ここでは触れないでおきましょう。CSSの性質について議論しないというのは良い点です。もっとうまく表現すべきでした。CSSの性質ではなく、コンポーネントベースのフレームワークのスタイリングに関するベストプラクティスについてです。そして、ボタンがこれらを適切に適用できない良い例であることにも完全に同意します。

より大きな視野で見ると、フロントエンドフレームワークのJavaScript側を近代化するための組織的な努力がありました。そしてそれは大成功だったと思います。クリーンな標準とよく構造化されたクラスで作業することは、今では本当に楽しいです。デザイナーとしても、新しいフロントエンドコンポーネントをより簡単かつ効率的に構築する機会が開かれました。

しかし、デザインシステムを同じ基準に引き上げるための同様のコミットメントがないという感覚を拭えません。CSS変数にあらゆる側面で追加することは、現在の方法よりも確かにパフォーマンスが高く、クリーンですが、依然としてより深いアーキテクチャの問題を回避しているように感じます。過度に具体的な宣言でいっぱいのコードベースであり、明確なコンポーネントスコープのスタイルがありません。これは、より困難な問題であるスタイリングアーキテクチャをフレームワークのモジュラーデザインと完全に整合させることを回避する「簡単な」解決策のように思えます。

これには多くの作業と後方互換性の問題が発生することは理解しています。しかし、チームはJavaScript側でこれらの課題にうまく対処してきました。JavaScriptがスタイルよりも大幅に多くのリソースを受け取り続ける場合、その格差は最終的なデザインに現れます。ユーザーは、理由を明確に説明できなくても、その違いを感じるでしょう。

開発者とユーザーエクスペリエンスの両方にとって長期的なメリットが変革的であると確信しているので、CSSアーキテクチャにも同じ近代化のエネルギーが適用されるのを見たいだけです。

---

_[View the full topic](https://meta.discourse.org/t/styling-discourse-with-variables-a-case-for-simpler-semantics/378001)._