【Cocoon】スタイルサンプル

※当サイトはアフィリエイト広告を利用しています

こんにちは、nanoです。WordPressのテーマ「Cocoon」でブログをゆっくり楽しんでます。

さて、WordPressのテーマ「Cocoon」のスタイルって色々ありますよね。迷うこともしばしば・・・。

「Cocoon」のスタイルのサンプル一覧を作りました。皆さんも参考にどうぞー。

ボックス(アイコン)

補足情報(i)
補足情報(?)
注意喚起(!)
メモ
コメント
OK
NG
GOOD
BAD
プロフィール

ボックス(案内)

プライマリー(濃い水色)
セカンダリー(濃い灰色)
サクセス(薄い緑)
インフォ(薄い青)
ワーニング(薄い黄色)
デンジャー(薄い赤色)
ライト(白色)
ダーク(暗い灰色)

ボックス(白抜き)

灰色
黄色
赤色
青色
緑色

ボックス(タブ)

「灰色」基準のサンプルです。その他に「黄色」「赤色」「青色」「緑色」が選べます。

チェック
コメント
ポイント
ティップス
ヒント
ピックアップ
ブックマーク
メモ
ダウンロード
ブレイク
Amazon
OK
NG
GOOD
BAD
プロフィール

ボックス(付箋風)

灰色
黄色
赤色
青色
緑色

バッジ

オレンジ

レッド

ピンク

パープル

ブルー

グリーン

イエロー

ブラウン

グレー

マイクロコピー

申し込みボタンなどに対して補足情報(マイクロコピー)を上下に追加できます。サンプルは「左側」に配置する設定で、その他に「中央」「右側」が設定できます。
テキスト(上)

申し込みボタン

申し込みボタン

テキスト(下)
吹き出し(上)

申し込みボタン

申し込みボタン

吹き出し(下)

ボタン

大きさ

レッド(小)

レッド(中)

レッド(大)

ボタンの大きさ(大)

ピンク

パープル

ディープパープル

インディゴ

ブルー

ライトブルー

シアン

ティール

グリーン

ライトグリーン

ライム

イエロー

アンバー

オレンジ

ディープオレンジ

ブラウン

グレー

囲みボタン

バリエーションは、ボタンと同じ

囲みボタン(小)

囲みボタン(中)

囲みブログカードラベル

まとめ

いろんなスタイルがあり、Cocoonを作成してくれた方に感謝です。

分かりやす記事を作成するのにとても役立ちますね!記事作成、楽しみましょう!それでは。

スポンサーリンク
タイトルとURLをコピーしました