コニファ・ロゴ

ツール集:backgroundに使うパターン用画像まとめ

このページの"header"部分でも使用しているbackground用の画像のまとめです。主にごく小さな画像(パターン画像)を縦横方向にリピートして敷きつめています。各サンプルの使用画像の青い四角の中が元の単体の画像です。 画像は随時追加していきます。

このページ掲載のパターン画像を差し替えて見た目を比較、確認できるページはこちらから

background指定の一例(CSSソース)

.sample1 {
	background: #fff url(csstest/img3/bg-4x4gray.gif);
	}

サンプル(1)

sample1

使用画像:bg-4x4gray.gif  画像サイズ:縦横4px

サンプル(2)

sample2

使用画像:bg-4x4violet.gif  画像サイズ:縦横4px

サンプル(3)

sample3

使用画像:bg-4x4blue.gif  画像サイズ:縦横4px

サンプル(4)

sample4

使用画像:bg-5x5green.gif  画像サイズ:縦横5px

サンプル(5)

sample5

使用画像:bg-5x5gray.gif  画像サイズ:縦横5px

サンプル(6)

sample6

使用画像:bg-6x6green.gif  画像サイズ:縦横6px

サンプル(7)

sample7

使用画像:bg-6x6gray.gif  画像サイズ:縦横6px

サンプル(8)

sample8

使用画像:bg-6x6yellow.gif  画像サイズ:縦横6px

サンプル(9)

sample9

使用画像:bg-7x7gpink.gif  画像サイズ:縦横7px

サンプル(10)

sample10

使用画像:bg-7x7gray.gif  画像サイズ:縦横7px

サンプル(11)

sample11

使用画像:bg-7x7violet.gif  画像サイズ:縦横7px

サンプル(12)

sample12

使用画像:bg-7x7blue.gif  画像サイズ:縦横7px

サンプル(13)

sample13

使用画像:bg-8x8green.gif  画像サイズ:縦横8px

サンプル(14)

sample14

使用画像:bg-8x8gray.gif  画像サイズ:縦横8px

サンプル(15)

sample15

使用画像:bg-8x8yellow.gif  画像サイズ:縦横8px

サンプル(16)

sample16

使用画像:bg-8x8ugreen.gif  画像サイズ:縦横8px

サンプル(17)

sample17

使用画像:bg-9x9blue.gif  画像サイズ:縦横9px

サンプル(18)

sample18

使用画像:bg-9x9gray.gif  画像サイズ:縦横9px

サンプル(19)

sample19

使用画像:bg-9x9green.gif  画像サイズ:縦横9px

サンプル(20)

sample20

使用画像:bg-10x10green.gif  画像サイズ:縦横10px

サンプル(21)

sample21

使用画像:bg-10x10violet.gif  画像サイズ:縦横10px

サンプル(22)

sample22

使用画像:bg-10x10blue.gif  画像サイズ:縦横10px

サンプル(23)

sample23

使用画像:bg-10x10gray.gif  画像サイズ:縦横10px

サンプル(24)

sample24

使用画像:bg-10x10dpink.gif  画像サイズ:縦横10px

サンプル(25)

sample25

使用画像:bg-10x10orange.gif  画像サイズ:縦横10px

サンプル(26)

sample26

使用画像:bg-10x10mos.gif  画像サイズ:縦横10px

サンプル(27)

sample27

使用画像:bg-10x10bgray.gif  画像サイズ:縦横10px

サンプル(28)

sample28

使用画像:bg-11x11ggray.gif  画像サイズ:縦横11px

サンプル(29)

sample29

使用画像:bg-11x11pink.gif  画像サイズ:縦横11px

サンプル(30)

sample30

使用画像:bg-11x11gray.gif  画像サイズ:縦横11px

サンプル(31)

sample31

使用画像:bg-11x11yellow.gif  画像サイズ:縦横11px

サンプル(32)

sample32

使用画像:bg-11x11violet.gif  画像サイズ:縦横11px

サンプル(33)

sample33

使用画像:bg-11x11blue.gif  画像サイズ:縦横11px

サンプル(34)

sample34

使用画像:bg-11x11green.gif  画像サイズ:縦横11px

サンプル(35)

sample35

使用画像:bg-11x11dred.gif  画像サイズ:縦横11px

サンプル(36)

sample36

使用画像:bg-12x12gray.gif  画像サイズ:縦横12px

サンプル(37)

sample37

使用画像:bg-12x12yellow.gif  画像サイズ:縦横12px

サンプル(38)

sample38

使用画像:bg-12x12violet.gif  画像サイズ:縦横12px

サンプル(39)

sample39

使用画像:bg-12x12pink.gif  画像サイズ:縦横12px

サンプル(40)

sample40

使用画像:bg-12x12green.gif  画像サイズ:縦横12px

サンプル(41)

sample41

使用画像:bg-12x12blue.gif  画像サイズ:縦横12px

サンプル(42)

sample42

使用画像:bg-12x12bgray.gif  画像サイズ:縦横12px

サンプル(43)

sample43

使用画像:bg-12x12bgray2.gif  画像サイズ:縦横12px

サンプル(44)

sample44

使用画像:bg-12x12yellow2.gif  画像サイズ:縦横12px

サンプル(45)

sample45

使用画像:bg-12x12green2.gif  画像サイズ:縦横12px

サンプル(46)

sample46

使用画像:bg-13x13pink.gif  画像サイズ:縦横13px

サンプル(47)

sample47

使用画像:bg-13x13violet.gif  画像サイズ:縦横13px

サンプル(48)

sample48

使用画像:bg-13x13blue.gif  画像サイズ:縦横13px

サンプル(49)

sample49

使用画像:bg-13x13green.gif  画像サイズ:縦横13px

サンプル(50)

sample50

使用画像:bg-13x13gray.gif  画像サイズ:縦横13px

サンプル(51)

sample51

使用画像:bg-13x13orange.gif  画像サイズ:縦横13px

サンプル(52)

sample52

使用画像:bg-8x8n-green.gif  画像サイズ:縦横8px

サンプル(53)

sample53

使用画像:bg-8x8n-bviolet.gif  画像サイズ:縦横8px

サンプル(54)

sample54

使用画像:bg-8x8n-gray.gif  画像サイズ:縦横8px

サンプル(55)

sample55

使用画像:bg-8x8n-blue.gif  画像サイズ:縦横8px

サンプル(56)

sample56

使用画像:bg-9x9n-dpink.gif  画像サイズ:縦横9px

サンプル(57)

sample57

使用画像:bg-9x9n-ygreen.gif  画像サイズ:縦横9px

サンプル(58)

sample58

使用画像:bg-9x9n-gray.gif  画像サイズ:縦横9px

サンプル(59)

sample59

使用画像:bg-9x9n-orange.gif  画像サイズ:縦横9px

サンプル(60)

sample60

使用画像:bg-9x9n-green.gif  画像サイズ:縦横9px

サンプル(61)

sample61

使用画像:bg-9x9n-cobalt.gif  画像サイズ:縦横9px

サンプル(62)

sample62

使用画像:bg-9x9n-purple.gif  画像サイズ:縦横9px

サンプル(63)

sample63

使用画像:bg-9x9n-gray2.gif  画像サイズ:縦横9px

サンプル(64)

sample64

使用画像:bg-9x9n-pink.gif  画像サイズ:縦横9px

サンプル(65)

sample65

使用画像:bg-9x9n-blue.gif  画像サイズ:縦横9px

サンプル(66)

sample66

使用画像:bg-9x9n-green2.gif  画像サイズ:縦横9px

サンプル(67)

sample67

使用画像:bg-9x9n-orange2.gif  画像サイズ:縦横9px

サンプル(68)

sample68

使用画像:bg-9x9n-gray3.gif  画像サイズ:縦横9px

サンプル(69)

sample69

使用画像:bg-9x9n-cobalt2.gif  画像サイズ:縦横9px

サンプル(70)

sample70

使用画像:bg-13x13n-ggray.gif  画像サイズ:縦横13px

サンプル(71)

sample71

使用画像:bg-13x13n-blue.gif  画像サイズ:縦横13px

サンプル(72)

sample72

使用画像:bg-14x14-purple.gif  画像サイズ:縦横14px

サンプル(73)

sample73

使用画像:bg-14x14-gray.gif  画像サイズ:縦横14px

サンプル(74)

sample74

使用画像:bg-14x14-green.gif  画像サイズ:縦横14px

サンプル(75)

sample75

使用画像:bg-14x14-orange.gif  画像サイズ:縦横14px

サンプル(76)

sample76

使用画像:bg-14x14-blue.gif  画像サイズ:縦横14px

サンプル(77)

sample77

使用画像:bg-14x14-pink.gif  画像サイズ:縦横14px

サンプル(78)

sample78

使用画像:bg-14x14-ygreen.gif  画像サイズ:縦横14px

サンプル(79)

sample79

使用画像:bg-14x14-bgray.gif  画像サイズ:縦横14px

サンプル(80)

sample80

使用画像:bg-14x14-violet.gif  画像サイズ:縦横14px

サンプル(81)

sample81

使用画像:bg-14x14-brown.gif  画像サイズ:縦横14px

サンプル(82)

sample82

使用画像:bg-14x14-green2.gif  画像サイズ:縦横14px

サンプル(83)

sample83

使用画像:bg-14x14-red.gif  画像サイズ:縦横14px

 

 

戻るボタン