Quieter

いつ使うか

/impeccable quieter は /impeccable bolder のカウンターウェイトです。インターフェースが視覚的に攻撃的、過剰に刺激的、またはフルボリュームで多すぎることをしようとしている場合に使ってください。ダーク背景のネオン、至る所のグラデーションテキスト、6つのアクセントカラー、すべてがアニメーション、20pxのシャドウ。デザインに息継ぎが必要で、視点を失わずに洗練させたい場合にquieterを使ってください。

また、/impeccable bolder が少し行き過ぎた後にも有用です。

仕組み

スキルは4つの軸で削減を通じて動作します。

1. カラー：彩度を下げる、OKLCHで彩度を下げる、アクセントを単一のプライマリとミュートされたサポートに引き戻す。意図的な色は最大2つまで。
2. コントラスト：極端なダークとライトを和らげる、範囲を縮める。背景をピュアホワイトとピュアブラックからペーパーとインクに移行。
3. 装飾：機能していないシャドウを削除、構造を担っていないボーダーを落とす、階層ではなくエネルギーのために存在するグラデーションを廃止。
4. モーションとエフェクト：アニメーションを遅くする、自動再生するものを削除、読みやすさに貢献しないパララックスとブラーを落とす。

スキルはデザインの意図を保持します。元に視点があったなら、quieter版は同じ視点をより自信を持って持ちます。中和ではなく、洗練です。

試してみる

/impeccable quieter the pricing page

典型的な差分：

• 価格のグラデーションテキストを削除、1ウェイト重いソリッドインクに置き換え
• 3つのアクセントカラーを1つ（マゼンタ）に削減、他の2つはニュートラルバリアントに
• カードシャドウを 0 20px 40px rgba(0,0,0,0.2) から 0 1px 0 var(--color-mist)（ヘアライン）に削減
• 背景をダークグラデーションから上部にクリーミーなウォッシュを施したペーパーに切り替え
• ヒーローアニメーションを3つのスタガー要素を持つ1.2s easeOutから単一の260msフェードインに

注意点

• 過剰適用すること。 Quieterはすでに抑制されているものに実行すると個性を剥ぎ取る可能性があります。デザインが正しく主張的である時ではなく、うるさすぎる時に使ってください。
• quieterとdistillを混同すること。 Quieterは強度を下げます。Distillは要素を削除します。異なる動きです。
• 「忙しすぎる」というクリティックに応答して実行すること。 忙しいは通常、うるさすぎるのではなく多すぎることを意味します。まず /impeccable distill を試してください。