Design

８Cubeと、27Cubeでは、アニメーションの違い(遅延など)が分かる様に、各Cubeに番号を付けています。Codeは、のクリックでクリップボードにCopyできます。各Cubeの定義には、静止とアニメーション・関連のプロパティ（継続時間、...

今回の記事は只の色見本です。が、新たな発見のありました。Webサイトでの色使いや、Blog記事でチョットした色を使いたいとき、微妙なグラデーションカラーを使いたい時など、色の選択と使い方には様々なシュチエーションがあると思います。中には、同...

--tagcloud-Design 数字部分に、カーソルを当ててみて(ホバーして)ください。タイトルが表示されている部分は、クリックすると該当のページにジャンプします。これは、タグクラウドを利用したメニューにもなります。タグクラウド数字部分...

HTMLとcssだけで作る虹色に変化する3DデザインHTMLの基本形はとても簡単なものです。そこからCSSでclassに様々な設定をして３D表示を完成させます。ここではステップを追う事。進捗が見えるようにHTMLとcssの進捗(進化)をco...

XY軸の値を求める為に、三角関数：sin , cos を使っています。x軸=cos(角度*距離)、y軸=sin(角度*距離) 角度は0～360で変化します。円の面積を求め定数(30)で割って動く３Dの表示範囲を可変にしています（面積内でねじれ表示）グリッドデザイン：コンテナ（display:grid）を利用しています。見出しと概説はコンテナ内の最初に記述しています。見出しの前後に表示(部分透過)されることで３D表示がおわかり戴けると思います。

３Dデザインで回転するCubeの色々、　最初の６つは、2累乗(0～5)（1,2,4,8,16,32）秒で回転するCubeです。（CSSのanimation:rotate_s 1s linear infinite;　～　でコントロール ） 次...

この様なCard Designは、如何でしょうか？各場所に配置しているアニメーションCardは、クリックできます。ボタンを配置している部分も、クリックできます。カーソルを、Cardまたは、Buttonに持ってくると、背景やボタンの色が変化し...