今回は、吹き出しデザインをCSSで作る方法を紹介したいと思います！ 最初に、ベースとなるコードを紹介した後、簡単なカスタムパターンをいくつか紹介していきたいと思います。 目次 ベースコード 使い方 カスタムパターン 吹き出しの色を変えてみる！ 吹き出しの方向を変更してみる！ 角丸表示にしてみる！ 影付きの吹き出しを表示してみる！ まとめ ベースコード 吹き出しデザインは以下のようなCSSで、実現することができます。 .speech-bubble { position: relative; display: inline-block; margin-bottom: 13px; padding: 1rem 1rem; min-width: 60px; max-width: 20rem; color: #929292; font-size: 16px; background: #d5f1a9;