#css

Webの見た目づくりは、ふつう「色を塗る」「影を足す」「グラデーションを入れる」を別々に考えます。Ambient CSSは、その発想を少しひっくり返して、ひとつの光源を定義すれば、そこから影やハイライト、面のグラデーションまでまとめて導けるようにした試みです。しかもただのデモではなく、Blenderのraytraceで見た結果に合わせて調整してあるのが興味深いところです。CSSの表現力を、見た目の派手さではなく“物理っぽさ”で押し上げようとしている点に、この話の新しさがあります。 Ambient CSSがやっているのは、CSSの部品を増やすことではありません。むしろ逆で、光の条件をひとつ決め、その条件に従って見た目を組み立てる考え方を提示しています。元記事の説明では、定義するのは light source であり、そこから every shadow, highlight and surface gradient が従って決まる、とされています。つまり、カードやボタンの影を個別に手で調整するのではなく、「光がどこから当たっているか」という上位のルールを先に置くわけです。 この仕組みは、B