フリー素材ブログ「素材屋とりっくすたー」

この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。

荒いブラシで線を引いたようなライン素材です。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


ブラシライン素材1pngファイルをダウンロード


ブラシライン素材2pngファイルをダウンロード

前回投稿からかなり間が空いてしまいました(;´Д｀)
苺祭りファイナル、苺のラインイラストです。

イラスト素材は全てpngファイル（解像度72dpi）で保存してあります。
Ｌサイズファイル（縦1200px×横1600px）とＳサイズファイル（縦600px×横800px）があります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


苺のラインイラスト1-Ｌpngファイルをダウンロード

苺のラインイラスト1-Ｓpngファイルをダウンロード



苺のラインイラスト2-Ｌpngファイルをダウンロード

苺のラインイラスト2-Ｓpngファイルをダウンロード

春の果物と言えば苺。
苺は野菜扱いもされてるので果物と書くか野菜と書くか迷ったんですが
日本じゃたいてい果物扱いなので、タグは果物にしてあります。

という訳で今回は苺キャライラストです。題して「いちごちゃん」（捻りなし）
ゆるキャラ風にしてみました。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


苺のキャラクターイラスト1pngファイルをダウンロード


苺のキャラクターイラスト2（顔だけバージョン）pngファイルをダウンロード

色んな種類の波線ライン素材です。
大きいサイズ（縦1200px×横1600px）と小さいサイズ（縦600px×横800px）を2種類ずつ用意しました。

イラスト素材は全てpngファイル（解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


波線ライン素材1（縦1200px×横1600px）pngファイルをダウンロード

波線ライン素材1（縦600px×横800px）pngファイルをダウンロード



波線ライン素材2（縦1200px×横1600px）pngファイルをダウンロード

波線ライン素材2（縦600px×横800px）pngファイルをダウンロード



波線ライン素材3（縦1200px×横1600px）pngファイルをダウンロード

波線ライン素材3（縦600px×横800px）pngファイルをダウンロード

「手洗いでウイルス対策」のイラストを作ってみました。
コロナウイルス以外のウイルス・細菌対策用イラストとしても使えるようにしました。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


「手洗いでウイルス対策」のイラストpngファイルをダウンロード

チェックやストライプ、ポルカドット等かわいい柄を集めたリボンイラストです。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


リボンイラスト1pngファイルをダウンロード


リボンイラスト2pngファイルをダウンロード


リボンイラスト3pngファイルをダウンロード

正方形を上下に並べたライン素材です。
大きいタイプと小さいタイプの2種類があります。

イラスト素材は全てpngファイル（解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。



ライン素材・大（縦1200px×横1600px、解像度72dpi）pngファイルをダウンロード


ライン素材・小（縦420px×横560x、解像度72dpi）pngファイルをダウンロード

今回は12種類のクッキーのイラストです。
この季節、お菓子と言えばトリックオアトリート。
日本はあの世とこの世を繋ぐ行事が多いですね。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


クッキーのイラストpngファイルをダウンロード


早いものでこのブログを始めてから1年経ちました。
気づけばもうハロウィンシーズン！
一番最初に投稿したのがハロウィン素材だった訳で……本当１年経つの早いなあ(;´Д｀)


そろそろ新しい事を試みようと現在画策中です。
これからも当ブログをよろしくお願いいたします！

ブログで文章を書いたりホームページを作ったりする時
「ここにちょっとアクセントが欲しいな」
「ここでちょっと話題が変わるから仕切りたいな」という時に使える素材です。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。

ジグザグ罫線pngファイルをダウンロード


話題を変えたい時などに
こんな風に使うと記事やページの内容が更に分かりやすくなると思います。




さて、今回は更にとても小さいサイズの罫線を作ってみました。

行の高さ20px用罫線（そのままクリックorタッチして保存）





行の高さ25px用罫線（そのままクリックorタッチして保存）





この小さい罫線を使ってCSSで指定するとノートやメモのように文字の行間に線を引くことができます。

例えば、

はじめまして、あけぴと申します！
フリーイラスト素材ブログ「素材屋とりっくすたー」に
お越しいただきありがとうございます！

上の文章に20pxの罫線を加えると

はじめまして、あけぴと申します！
フリーイラスト素材ブログ「素材屋とりっくすたー」に
お越しいただきありがとうございます！

こうなります。
ソースコードはこちら。

＜span style=" font-size:14px; color:#333333; background:url('罫線画像のURL'); border:0; line-height:20px; margin:0px;"＞

罫線画像をアップロードしてこのソースコード（＜＞の部分を半角<>に直す）をコピペするだけで
簡単に表示できます。

ただし注意する点が二つ。
ソースコードの中にline-heightという値があります。これは行の高さです。
行の高さ20px用の罫線を使う時は20px、行の高さ25px用の罫線を使う時は25pxで固定して下さい。
固定しないと罫線と文字がズレてしまったり表示されない場合があります。

そしてフォントサイズですが、こちらもあまり弄らないのがベストです。
・フォントサイズが14px〜18pxなら20pxの罫線
・フォントサイズが16px〜20pxなら25pxの罫線
が一番見やすい組み合わせだと思います。
ブログやサイトの雰囲気をぐっと変えるアイテムとしてお使いください。

しかしですね……この方法、スマホ表示版だとレイアウトが大幅に崩れたり
表示されなかったりするのが難点なんですよね。
試しに自分のスマホとタブレットで確認してみました。（ブラウザはchrome）


スマホ表示版「いらない線が出る」


タブレット表示版「全く表示されない」



あちゃー。こりゃ困った。
スマホ表示版でも上手く表示される方法ってあるんでしょうか？
スマホ版のソースコードを弄った事がないのでこの機会に少し調べてみます。
新しい発見があればまた記事にしてみたいと思います！

タグ：ジグザグ 罫線

木でできた柵のイラストです。

イラスト素材は全てpngファイル（縦1200px×横1600px、解像度72dpi）で保存してあります。
pngファイルはサンプル画像の下のテキスト
（〇〇をダウンロード）をクリックorタッチして画像保存して下さい。


柵のイラスト1pngファイルをダウンロード


柵のイラスト2pngファイルをダウンロード

ちょっと小さめなサイズもあります。

柵のイラスト3pngファイルをダウンロード



イラストの一部に使ったり


ブログやサイトで文章の合間に挟んでみたり

あなたの作品を彩るアイテムとして自由にお使い下さい！