変更点
参考:旧デザイン
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/FireShot-Capture-208-%E3%81%B2%E3%81%BF%E3%81%A3%E3%81%A1%E3%82%83%E3%82%93%E3%81%AE%EF%BC%AB%EF%BC%A1%EF%BC%AD%EF%BC%A9%E3%82%B5%E3%82%A4%E3%83%88-hmts.jp_.png?resize=753%2C1024&ssl=1)
ヘッダー
ヘッダーの小型化
ヘッダーカラーから
#98623c
を削除し
#8a3b00に統一
白線の区切りを削除
メインカラム、サイドバーのデザイン
角丸を25pxから1emに
目次のデザイン
強力な角丸だったのを、わずかに丸い角に変更。
枠線の左右をなくし、わずかに背景色を採用(h4の背景色と同様)
各項目をホバーしたときの色は、h3の背景色に統一
見出しのデザイン
h2, h3については、角丸を2pxから0.1emに変更。
h4については、角丸を下記状況から0.05emに変更。h5, h6についても同様の状況から角丸を削除。
h3の背景色を「rgb(254,234,234)」にした
h4の背景色を「rgb(254,244,244)」に戻す
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image.png?resize=484%2C468&ssl=1)
ブログカード
下記から変更
余白の指定するセレクタを変更して、2.5emに拡大
枠線を3pxにして太くした
影の前者を無効化
角丸を0.5emに変更
ホバーしたときの移動量を4pxに拡大
ホバーしたときの移動の仕方をease-outに変更
ホバーしたときの色を関連記事などと統一
謎コードの無効化(画像の直後の部分)
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-2.png?resize=781%2C357&ssl=1)
SNSシェアボタン
角丸の加減を弱くした。以下のように更新
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-5.png?resize=486%2C510&ssl=1)
関連記事、人気記事などのデザイン
以下から変更。
余白を上下0.5emに
線の太さを3pxにして、丸みを0.3emに
影を完全削除
ホバー時の色を「rgb(192,162,199,0.3)」に
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-1.png?resize=511%2C654&ssl=1)
加えて、ホバー時に上に上がるように
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-6.png?resize=708%2C532&ssl=1)
Cocoonボタン
影を削除。4px→0px
カルーセル
枠線を3pxに変更し、ほかは人気記事と同様の変更をした
トップページのコンテンツ一覧
次のように変更
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-3.png?resize=707%2C379&ssl=1)
![](https://i0.wp.com/hmts.jp/wp-content/uploads/2025/02/image-4.png?resize=719%2C347&ssl=1)