SWELL で使えるアイコンの使い方と一覧について解説

広告:ページ内にてアフィリエイト広告を利用しています。

SWELL アイコンの一覧

SWELLでは、多数のアイコン表示に対応しています。アイコンを使うことで、ワンポイントで分かりやすく記事内を装飾することができますね。

ポイント

本記事では、

アイコンを表示する方法とアイコン一覧を解説します。

アイコンを使ってかっこいいページにしていきましょう。

SWELL おすすめサンプルページ
おしゃれサイト

\SWELL でオシャレサイトを作る方法は こちら をクリックしてください/

目次
PR

アイコンの使い方

SWELL アイコンを使い場合は、ショートコードにクラス名を記載します。

[icon class="アイコンクラス名"]

■ アイコンの使用例

本文中に記載する

ポイント

本を読みます。

注意が必要です。

ボタンの中に使える

電話番号ボタンに電話番号アイコンを使っています。

ポイント

SWELL アイコン一覧

SWELL で使えるアイコンの一覧です。

アイコンクラス名アイコンクラス名
icon-caret-downicon-caret-left
icon-caret-righticon-caret-up
icon-chevron-downicon-chevron-left
icon-chevron-righticon-chevron-up
icon-homeicon-tag
icon-foldericon-file-empty
icon-bubbleicon-bubbles
icon-eyeicon-link
icon-shareicon-film
icon-imageicon-heart
icon-star-emptyicon-star-full
icon-star-halficon-blocked
icon-infoicon-info-fill
icon-alert-outlineicon-alert
icon-modifiedicon-posted
icon-settingsicon-download
icon-lock-openicon-lock-closed
icon-personicon-mail
icon-carticon-phone
icon-penicon-quill
icon-flagicon-bookmark
icon-bookicon-megaphone
icon-thumb_downicon-thumb_up
icon-light-bulbicon-light-bulb-fill
icon-circleicon-x
icon-triangleicon-check
icon-hatenaicon-minus
icon-plusicon-toc
icon-searchicon-close-thin
icon-menu-thinicon-more_arrow
icon-swellicon-tiktok
icon-roomicon-amazon
icon-codepenicon-facebook
icon-feedlyicon-github
icon-hatebuicon-instagram
icon-lineicon-medium
icon-pinteresticon-pocket
icon-rssicon-tumblr
icon-twittericon-wordpress
icon-youtube

ぜひ、すてきなサイトを作ってくださいね。

PR

まとめ

SWELL は標準で簡単に使えるアイコン文字を多数用意しています。

使い勝手がよいので、ぜひ使いたいですね。

SWELL おしゃれサイト作り方

SWELL の利用方法などについてココナラにて「支援作業」を販売しております。

よかったらご利用くださいませ。

PR

PR

一番上に戻る(Back to the initial position on click.)

トップページ(Home.)

PR
Amazon でお買い物
楽天市場でお買い物
広告の設置・収入について

当サイトは Amazonのアソシエイトとして、適格販売により収入を得ています。

当サイトは Google アドセンスを利用し、広告により収入を得ています。

当サイトは ASP が提供するサービスを利用し、広告、適格販売により収入を得ています。

電気通信事業法改正に伴う表記

この記事が気に入ったら
フォローしてね!

目次