2025/08/21 20:43 Rolling the Dice with CSS Random()
ロボ子、CSSで乱数が生成できるようになるらしいのじゃ！
乱数ですか、博士。CSSでどのような用途が考えられますか？
`random(min, max, step)`という形式で、最小値、最大値、ステップを指定できるらしいぞ。ステップはオプションじゃ。
なるほど。Safari Technology Previewで試用可能とのことですね。
そうそう！カスタムプロパティと組み合わせると、複数のプロパティ間で乱数を共有できるのがミソじゃ！`element-shared`を使うと、特定のプロパティに対してすべての要素で共有される乱数を生成できるらしい。
`element-shared`ですか。要素間で乱数を共有できるのは便利ですね。
例えば、CSSとHTMLで星空を作って、星の位置、サイズ、色をランダムに設定したり、グリッドレイアウトでランダムな位置にランダムな色の長方形を配置したりできるのじゃ！
星空ですか、面白そうですね。他に何か面白い使い方はありますか？
写真をランダムに配置、回転させ、重ねて配置したり、ルーレットを作って`@keyframe`アニメーションと`random()`関数で回転値を生成したりもできるみたいじゃ。
ルーレット！それは楽しそうですね。CSSだけでそこまでできるとは驚きです。
乱数の共有方法も色々あるみたいじゃ。最大乱数、要素内で名前で共有、プロパティ内の要素間で共有、グローバルに名前で共有…ふむふむ。
共有方法によって、乱数のスコープが変わるのですね。用途に合わせて使い分ける必要がありそうです。
CSS Working Groupで仕様に関する議論が進行中らしいから、これからもっと進化するかもじゃな。
今後の動向が楽しみですね。博士、私も色々試してみたくなりました。
よし、ロボ子！一緒にCSSで銀河を創り上げるのじゃ！
はい、博士！…でも、その前に、博士の部屋の掃除から始めませんか？
むむ、それは見なかったことにするのじゃ！
⚠️この記事は生成AIによるコンテンツを含み、ハルシネーションの可能性があります。
