Trình tạo họa tiết
Tạo họa tiết nền SVG liền mạch từ gần 2.000 thiết kế: đổi màu, thu phóng, khoảng cách và góc, rồi sao chép CSS hoặc tải xuống SVG, PNG hay WebP.
1Chọn họa tiết
Không có họa tiết nào khớp với các bộ lọc này.
2Chọn màu sắc
3Tinh chỉnh họa tiết
4Tạo chuyển động (tùy chọn)
Họa tiết dịch chuyển đúng một ô lặp mỗi vòng nên không bao giờ bị giật. Chuyển động được lưu trong mã và tệp SVG; các tệp ảnh vẫn đứng yên.
5Sao chép hoặc tải xuống
Tiêu đề của bạn ở đây
Xem họa tiết trông thế nào phía sau nội dung thực.
Bắt đầuXem theo bộ sưu tập
 rotate(0) scale(1)'%3E%3Crect width='64' height='38.4' fill='%231b2a49'/%3E%3Cpath d='M0 0C0 -8.84 7.16 -16 16 -16C24.84 -16 32 -8.84 32 0M0 38.4C0 29.56 7.16 22.4 16 22.4C24.84 22.4 32 29.56 32 38.4M64 0C64 -8.84 71.16 -16 80 -16C88.84 -16 96 -8.84 96 0M64 38.4C64 29.56 71.16 22.4 80 22.4C88.84 22.4 96 29.56 96 38.4M-32 0C-32 -8.84 -24.84 -16 -16 -16C-7.16 -16 0 -8.84 0 0M-32 38.4C-32 29.56 -24.84 22.4 -16 22.4C-7.16 22.4 0 29.56 0 38.4M32 0C32 -8.84 39.16 -16 48 -16C56.84 -16 64 -8.84 64 0M32 38.4C32 29.56 39.16 22.4 48 22.4C56.84 22.4 64 29.56 64 38.4M16 19.2C16 10.36 23.16 3.2 32 3.2C40.84 3.2 48 10.36 48 19.2M16 57.6C16 48.76 23.16 41.6 32 41.6C40.84 41.6 48 48.76 48 57.6M-16 19.2C-16 10.36 -8.84 3.2 0 3.2C8.84 3.2 16 10.36 16 19.2M-16 57.6C-16 48.76 -8.84 41.6 0 41.6C8.84 41.6 16 48.76 16 57.6M48 19.2C48 10.36 55.16 3.2 64 3.2C72.84 3.2 80 10.36 80 19.2M48 57.6C48 48.76 55.16 41.6 64 41.6C72.84 41.6 80 48.76 80 57.6' fill='none' stroke='%23f2e9d8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Đường nét và sóng
273 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='32' height='32' fill='%23fefefe'/%3E%3Cpath d='M16 16L25.6 16C25.6 21.3 21.3 25.6 16 25.6C10.7 25.6 6.4 21.3 6.4 16Z' fill='%23111111'/%3E%3Cpath d='M16 16L6.4 16C6.4 10.7 10.7 6.4 16 6.4C21.3 6.4 25.6 10.7 25.6 16Z' fill='%23777777'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Chấm và hình tròn
189 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='36' height='36' fill='%231b2a49'/%3E%3Cpath d='M-28.8 -36L-7.2 -36L0 -28.8L0 -7.2L-7.2 0L-28.8 0L-36 -7.2L-36 -28.8ZM-28.8 0L-7.2 0L0 7.2L0 28.8L-7.2 36L-28.8 36L-36 28.8L-36 7.2ZM-28.8 36L-7.2 36L0 43.2L0 64.8L-7.2 72L-28.8 72L-36 64.8L-36 43.2ZM7.2 -36L28.8 -36L36 -28.8L36 -7.2L28.8 0L7.2 0L0 -7.2L0 -28.8ZM7.2 0L28.8 0L36 7.2L36 28.8L28.8 36L7.2 36L0 28.8L0 7.2ZM7.2 36L28.8 36L36 43.2L36 64.8L28.8 72L7.2 72L0 64.8L0 43.2ZM43.2 -36L64.8 -36L72 -28.8L72 -7.2L64.8 0L43.2 0L36 -7.2L36 -28.8ZM43.2 0L64.8 0L72 7.2L72 28.8L64.8 36L43.2 36L36 28.8L36 7.2ZM43.2 36L64.8 36L72 43.2L72 64.8L64.8 72L43.2 72L36 64.8L36 43.2Z' fill='none' stroke='%23f2e9d8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='miter'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Hình học
138 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='32' height='32' fill='%23fefefe'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M0 -16C0 -7.16 -7.16 0 -16 0C-24.84 0 -32 -7.16 -32 -16C-32 -24.84 -24.84 -32 -16 -32C-7.16 -32 0 -24.84 0 -16Z'/%3E%3Cpath d='M0 16C0 24.84 -7.16 32 -16 32C-24.84 32 -32 24.84 -32 16C-32 7.16 -24.84 0 -16 0C-7.16 0 0 7.16 0 16Z'/%3E%3Cpath d='M0 48C0 56.84 -7.16 64 -16 64C-24.84 64 -32 56.84 -32 48C-32 39.16 -24.84 32 -16 32C-7.16 32 0 39.16 0 48Z'/%3E%3Cpath d='M32 -16C32 -7.16 24.84 0 16 0C7.16 0 0 -7.16 0 -16C0 -24.84 7.16 -32 16 -32C24.84 -32 32 -24.84 32 -16Z'/%3E%3Cpath d='M32 16C32 24.84 24.84 32 16 32C7.16 32 0 24.84 0 16C0 7.16 7.16 0 16 0C24.84 0 32 7.16 32 16Z'/%3E%3Cpath d='M32 48C32 56.84 24.84 64 16 64C7.16 64 0 56.84 0 48C0 39.16 7.16 32 16 32C24.84 32 32 39.16 32 48Z'/%3E%3Cpath d='M64 -16C64 -7.16 56.84 0 48 0C39.16 0 32 -7.16 32 -16C32 -24.84 39.16 -32 48 -32C56.84 -32 64 -24.84 64 -16Z'/%3E%3Cpath d='M64 16C64 24.84 56.84 32 48 32C39.16 32 32 24.84 32 16C32 7.16 39.16 0 48 0C56.84 0 64 7.16 64 16Z'/%3E%3Cpath d='M64 48C64 56.84 56.84 64 48 64C39.16 64 32 56.84 32 48C32 39.16 39.16 32 48 32C56.84 32 64 39.16 64 48Z'/%3E%3C/g%3E%3Cpath d='M24 16C24 20.42 20.42 24 16 24C11.58 24 8 20.42 8 16C8 11.58 11.58 8 16 8C20.42 8 24 11.58 24 16Z' fill='%23777777'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M16 0C16 8.84 8.84 16 0 16C-8.84 16 -16 8.84 -16 0C-16 -8.84 -8.84 -16 0 -16C8.84 -16 16 -8.84 16 0Z'/%3E%3Cpath d='M16 32C16 40.84 8.84 48 0 48C-8.84 48 -16 40.84 -16 32C-16 23.16 -8.84 16 0 16C8.84 16 16 23.16 16 32Z'/%3E%3Cpath d='M48 0C48 8.84 40.84 16 32 16C23.16 16 16 8.84 16 0C16 -8.84 23.16 -16 32 -16C40.84 -16 48 -8.84 48 0Z'/%3E%3Cpath d='M48 32C48 40.84 40.84 48 32 48C23.16 48 16 40.84 16 32C16 23.16 23.16 16 32 16C40.84 16 48 23.16 48 32Z'/%3E%3C/g%3E%3Cg fill='%23777777'%3E%3Cpath d='M8 0C8 4.42 4.42 8 0 8C-4.42 8 -8 4.42 -8 0C-8 -4.42 -4.42 -8 0 -8C4.42 -8 8 -4.42 8 0Z'/%3E%3Cpath d='M8 32C8 36.42 4.42 40 0 40C-4.42 40 -8 36.42 -8 32C-8 27.58 -4.42 24 0 24C4.42 24 8 27.58 8 32Z'/%3E%3Cpath d='M40 0C40 4.42 36.42 8 32 8C27.58 8 24 4.42 24 0C24 -4.42 27.58 -8 32 -8C36.42 -8 40 -4.42 40 0Z'/%3E%3Cpath d='M40 32C40 36.42 36.42 40 32 40C27.58 40 24 36.42 24 32C24 27.58 27.58 24 32 24C36.42 24 40 27.58 40 32Z'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
3D và ảo ảnh
99 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='24' height='24' fill='%231b2a49'/%3E%3Cpath d='M12 -24L12 0M12 0L12 24M12 24L12 48M-24 12L0 12M0 12L24 12M24 12L48 12' fill='none' stroke='%23f2e9d8' stroke-width='1.5' stroke-linecap='butt' stroke-linejoin='round' stroke-dasharray='2 3'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Vải dệt và đan
105 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='28' height='16' fill='%23fefefe'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M0 0L14 7L14 15L0 8Z'/%3E%3Cpath d='M0 16L14 23L14 31L0 24Z'/%3E%3Cpath d='M28 0L42 7L42 15L28 8Z'/%3E%3Cpath d='M28 16L42 23L42 31L28 24Z'/%3E%3C/g%3E%3Cg fill='%23777777'%3E%3Cpath d='M-14 7L0 0L0 8L-14 15Z'/%3E%3Cpath d='M-14 23L0 16L0 24L-14 31Z'/%3E%3Cpath d='M14 7L28 0L28 8L14 15Z'/%3E%3Cpath d='M14 23L28 16L28 24L14 31Z'/%3E%3Cpath d='M0 -8L14 -1L14 7L0 0Z'/%3E%3Cpath d='M0 8L14 15L14 23L0 16Z'/%3E%3Cpath d='M28 -8L42 -1L42 7L28 0Z'/%3E%3Cpath d='M28 8L42 15L42 23L28 16Z'/%3E%3C/g%3E%3Cg fill='%23d90429'%3E%3Cpath d='M-14 -1L0 -8L0 0L-14 7Z'/%3E%3Cpath d='M-14 15L0 8L0 16L-14 23Z'/%3E%3Cpath d='M14 -1L28 -8L28 0L14 7Z'/%3E%3Cpath d='M14 15L28 8L28 16L14 23Z'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Gạch xây và gạch lát
148 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='24' height='24' fill='%231b2a49'/%3E%3Cpath d='M0 -12C0 -5.37 -5.37 0 -12 0C-18.63 0 -24 -5.37 -24 -12C-24 -18.63 -18.63 -24 -12 -24C-5.37 -24 0 -18.63 0 -12ZM0 12C0 18.63 -5.37 24 -12 24C-18.63 24 -24 18.63 -24 12C-24 5.37 -18.63 0 -12 0C-5.37 0 0 5.37 0 12ZM0 36C0 42.63 -5.37 48 -12 48C-18.63 48 -24 42.63 -24 36C-24 29.37 -18.63 24 -12 24C-5.37 24 0 29.37 0 36ZM24 -12C24 -5.37 18.63 0 12 0C5.37 0 0 -5.37 0 -12C0 -18.63 5.37 -24 12 -24C18.63 -24 24 -18.63 24 -12ZM24 12C24 18.63 18.63 24 12 24C5.37 24 0 18.63 0 12C0 5.37 5.37 0 12 0C18.63 0 24 5.37 24 12ZM24 36C24 42.63 18.63 48 12 48C5.37 48 0 42.63 0 36C0 29.37 5.37 24 12 24C18.63 24 24 29.37 24 36ZM48 -12C48 -5.37 42.63 0 36 0C29.37 0 24 -5.37 24 -12C24 -18.63 29.37 -24 36 -24C42.63 -24 48 -18.63 48 -12ZM48 12C48 18.63 42.63 24 36 24C29.37 24 24 18.63 24 12C24 5.37 29.37 0 36 0C42.63 0 48 5.37 48 12ZM48 36C48 42.63 42.63 48 36 48C29.37 48 24 42.63 24 36C24 29.37 29.37 24 36 24C42.63 24 48 29.37 48 36ZM12 0C12 6.63 6.63 12 0 12C-6.63 12 -12 6.63 -12 0C-12 -6.63 -6.63 -12 0 -12C6.63 -12 12 -6.63 12 0ZM12 24C12 30.63 6.63 36 0 36C-6.63 36 -12 30.63 -12 24C-12 17.37 -6.63 12 0 12C6.63 12 12 17.37 12 24ZM36 0C36 6.63 30.63 12 24 12C17.37 12 12 6.63 12 0C12 -6.63 17.37 -12 24 -12C30.63 -12 36 -6.63 36 0ZM36 24C36 30.63 30.63 36 24 36C17.37 36 12 30.63 12 24C12 17.37 17.37 12 24 12C30.63 12 36 17.37 36 24Z' fill='none' stroke='%23f2e9d8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Nhật Bản
33 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='48' height='48' fill='%23fefefe'/%3E%3Cpath d='M-1.83 -14.82L-16.87 -16.87L-14.82 -1.83L-24 -13.92L-33.18 -1.83L-31.13 -16.87L-46.17 -14.82L-34.08 -24L-46.17 -33.18L-31.13 -31.13L-33.18 -46.17L-24 -34.08L-14.82 -46.17L-16.87 -31.13L-1.83 -33.18L-13.92 -24ZM-1.83 33.18L-16.87 31.13L-14.82 46.17L-24 34.08L-33.18 46.17L-31.13 31.13L-46.17 33.18L-34.08 24L-46.17 14.82L-31.13 16.87L-33.18 1.83L-24 13.92L-14.82 1.83L-16.87 16.87L-1.83 14.82L-13.92 24ZM-1.83 81.18L-16.87 79.13L-14.82 94.17L-24 82.08L-33.18 94.17L-31.13 79.13L-46.17 81.18L-34.08 72L-46.17 62.82L-31.13 64.87L-33.18 49.83L-24 61.92L-14.82 49.83L-16.87 64.87L-1.83 62.82L-13.92 72ZM46.17 -14.82L31.13 -16.87L33.18 -1.83L24 -13.92L14.82 -1.83L16.87 -16.87L1.83 -14.82L13.92 -24L1.83 -33.18L16.87 -31.13L14.82 -46.17L24 -34.08L33.18 -46.17L31.13 -31.13L46.17 -33.18L34.08 -24ZM46.17 33.18L31.13 31.13L33.18 46.17L24 34.08L14.82 46.17L16.87 31.13L1.83 33.18L13.92 24L1.83 14.82L16.87 16.87L14.82 1.83L24 13.92L33.18 1.83L31.13 16.87L46.17 14.82L34.08 24ZM46.17 81.18L31.13 79.13L33.18 94.17L24 82.08L14.82 94.17L16.87 79.13L1.83 81.18L13.92 72L1.83 62.82L16.87 64.87L14.82 49.83L24 61.92L33.18 49.83L31.13 64.87L46.17 62.82L34.08 72ZM94.17 -14.82L79.13 -16.87L81.18 -1.83L72 -13.92L62.82 -1.83L64.87 -16.87L49.83 -14.82L61.92 -24L49.83 -33.18L64.87 -31.13L62.82 -46.17L72 -34.08L81.18 -46.17L79.13 -31.13L94.17 -33.18L82.08 -24ZM94.17 33.18L79.13 31.13L81.18 46.17L72 34.08L62.82 46.17L64.87 31.13L49.83 33.18L61.92 24L49.83 14.82L64.87 16.87L62.82 1.83L72 13.92L81.18 1.83L79.13 16.87L94.17 14.82L82.08 24ZM94.17 81.18L79.13 79.13L81.18 94.17L72 82.08L62.82 94.17L64.87 79.13L49.83 81.18L61.92 72L49.83 62.82L64.87 64.87L62.82 49.83L72 61.92L81.18 49.83L79.13 64.87L94.17 62.82L82.08 72Z' fill='none' stroke='%23111111' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='miter'/%3E%3Cpath d='M0 -12.96L4.8 -4.8L12.96 0L4.8 4.8L0 12.96L-4.8 4.8L-12.96 0L-4.8 -4.8ZM0 35.04L4.8 43.2L12.96 48L4.8 52.8L0 60.96L-4.8 52.8L-12.96 48L-4.8 43.2ZM48 -12.96L52.8 -4.8L60.96 0L52.8 4.8L48 12.96L43.2 4.8L35.04 0L43.2 -4.8ZM48 35.04L52.8 43.2L60.96 48L52.8 52.8L48 60.96L43.2 52.8L35.04 48L43.2 43.2Z' fill='none' stroke='%23777777' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='miter'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Hồi giáo và Moor
30 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='32' height='44.8' fill='%231b2a49'/%3E%3Cpath d='M-16 -44.8L0 -22.4L-16 0L-32 -22.4ZM-16 0L0 22.4L-16 44.8L-32 22.4ZM-16 44.8L0 67.2L-16 89.6L-32 67.2ZM16 -44.8L32 -22.4L16 0L0 -22.4ZM16 0L32 22.4L16 44.8L0 22.4ZM16 44.8L32 67.2L16 89.6L0 67.2ZM48 -44.8L64 -22.4L48 0L32 -22.4ZM48 0L64 22.4L48 44.8L32 22.4ZM48 44.8L64 67.2L48 89.6L32 67.2ZM0 -22.4L16 0L0 22.4L-16 0ZM0 22.4L16 44.8L0 67.2L-16 44.8ZM32 -22.4L48 0L32 22.4L16 0ZM32 22.4L48 44.8L32 67.2L16 44.8Z' fill='none' stroke='%23f2e9d8' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='miter'/%3E%3Cpath d='M16 11.2L24 22.4L16 33.6L8 22.4ZM0 -11.2L8 0L0 11.2L-8 0ZM0 33.6L8 44.8L0 56L-8 44.8ZM32 -11.2L40 0L32 11.2L24 0ZM32 33.6L40 44.8L32 56L24 44.8Z' fill='none' stroke='%23e4572e' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='miter'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Art Deco
47 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='32' height='48' fill='%23fefefe'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M0 24L4 24L4 15.84L8 15.84L8 7.92L12 7.92L12 0L20 0L20 7.92L24 7.92L24 15.84L28 15.84L28 24Z'/%3E%3Cpath d='M0 72L4 72L4 63.84L8 63.84L8 55.92L12 55.92L12 48L20 48L20 55.92L24 55.92L24 63.84L28 63.84L28 72Z'/%3E%3Cpath d='M32 24L36 24L36 15.84L40 15.84L40 7.92L44 7.92L44 0L52 0L52 7.92L56 7.92L56 15.84L60 15.84L60 24Z'/%3E%3Cpath d='M32 72L36 72L36 63.84L40 63.84L40 55.92L44 55.92L44 48L52 48L52 55.92L56 55.92L56 63.84L60 63.84L60 72Z'/%3E%3C/g%3E%3Cg fill='%23777777'%3E%3Cpath d='M0 0L4 -24L8 0Z'/%3E%3Cpath d='M0 48L4 24L8 48Z'/%3E%3Cpath d='M32 0L36 -24L40 0Z'/%3E%3Cpath d='M32 48L36 24L40 48Z'/%3E%3Cpath d='M8 0L12 -24L16 0Z'/%3E%3Cpath d='M8 48L12 24L16 48Z'/%3E%3Cpath d='M16 0L20 -24L24 0Z'/%3E%3Cpath d='M16 48L20 24L24 48Z'/%3E%3Cpath d='M-8 0L-4 -24L0 0Z'/%3E%3Cpath d='M-8 48L-4 24L0 48Z'/%3E%3Cpath d='M24 0L28 -24L32 0Z'/%3E%3Cpath d='M24 48L28 24L32 48Z'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Bộ lạc và dân gian
62 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='36' height='36' fill='%231b2a49'/%3E%3Cpath d='M24.22 18C24.22 21.44 21.44 24.22 18 24.22C14.56 24.22 11.78 21.44 11.78 18C11.78 14.56 14.56 11.78 18 11.78C21.44 11.78 24.22 14.56 24.22 18Z' fill='%23f2e9d8'/%3E%3Cpath d='M26.42 18L30.31 18M24.82 22.95L27.96 25.24M20.6 26.01L21.8 29.71M15.4 26.01L14.2 29.71M11.18 22.95L8.04 25.24M9.58 18L5.69 18M11.18 13.05L8.04 10.76M15.4 9.99L14.2 6.29M20.6 9.99L21.8 6.29M24.82 13.05L27.96 10.76' fill='none' stroke='%23e4572e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Thiên nhiên
196 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='36' height='36' fill='%23fefefe'/%3E%3Cpath d='M23.44 11.52C23.44 14.53 21.01 16.96 18 16.96C14.99 16.96 12.56 14.53 12.56 11.52C12.56 8.51 14.99 6.08 18 6.08C21.01 6.08 23.44 8.51 23.44 11.52ZM16.96 19.94C16.96 22.95 14.53 25.39 11.52 25.39C8.51 25.39 6.08 22.95 6.08 19.94C6.08 16.94 8.51 14.5 11.52 14.5C14.53 14.5 16.96 16.94 16.96 19.94ZM29.92 19.94C29.92 22.95 27.49 25.39 24.48 25.39C21.47 25.39 19.04 22.95 19.04 19.94C19.04 16.94 21.47 14.5 24.48 14.5C27.49 14.5 29.92 16.94 29.92 19.94ZM16.7 18L19.3 18L21.89 30.96L14.11 30.96Z' fill='%23111111'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Biểu tượng và đồ vật
236 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='36' height='36' fill='%231b2a49'/%3E%3Cg fill='%232e86ab'%3E%3Cpath d='M0 0L6.02 0L6.02 6.02L0 6.02Z'/%3E%3Cpath d='M0 36L6.02 36L6.02 42.02L0 42.02Z'/%3E%3Cpath d='M36 0L42.02 0L42.02 6.02L36 6.02Z'/%3E%3Cpath d='M36 36L42.02 36L42.02 42.02L36 42.02Z'/%3E%3Cpath d='M6 0L12.02 0L12.02 6.02L6 6.02Z'/%3E%3Cpath d='M6 36L12.02 36L12.02 42.02L6 42.02Z'/%3E%3Cpath d='M24 0L30.02 0L30.02 6.02L24 6.02Z'/%3E%3Cpath d='M24 36L30.02 36L30.02 42.02L24 42.02Z'/%3E%3C/g%3E%3Cg fill='%23e4572e'%3E%3Cpath d='M-6 0L0.02 0L0.02 6.02L-6 6.02Z'/%3E%3Cpath d='M-6 36L0.02 36L0.02 42.02L-6 42.02Z'/%3E%3Cpath d='M30 0L36.02 0L36.02 6.02L30 6.02Z'/%3E%3Cpath d='M30 36L36.02 36L36.02 42.02L30 42.02Z'/%3E%3C/g%3E%3Cg fill='%232e86ab'%3E%3Cpath d='M12 6L18.02 6L18.02 12.02L12 12.02Z'/%3E%3Cpath d='M18 6L24.02 6L24.02 12.02L18 12.02Z'/%3E%3Cpath d='M-6 12L0.02 12L0.02 18.02L-6 18.02Z'/%3E%3Cpath d='M30 12L36.02 12L36.02 18.02L30 18.02Z'/%3E%3C/g%3E%3Cg fill='%23f2e9d8'%3E%3Cpath d='M0 18L6.02 18L6.02 24.02L0 24.02Z'/%3E%3Cpath d='M36 18L42.02 18L42.02 24.02L36 24.02Z'/%3E%3C/g%3E%3Cpath d='M12 18L18.02 18L18.02 24.02L12 24.02Z' fill='%23e4572e'/%3E%3Cpath d='M24 18L30.02 18L30.02 24.02L24 24.02Z' fill='%232e86ab'/%3E%3Cg fill='%23f2e9d8'%3E%3Cpath d='M0 24L6.02 24L6.02 30.02L0 30.02Z'/%3E%3Cpath d='M36 24L42.02 24L42.02 30.02L36 30.02Z'/%3E%3C/g%3E%3Cg fill='%23e4572e'%3E%3Cpath d='M12 24L18.02 24L18.02 30.02L12 30.02Z'/%3E%3Cpath d='M18 24L24.02 24L24.02 30.02L18 30.02Z'/%3E%3Cpath d='M0 -6L6.02 -6L6.02 0.02L0 0.02Z'/%3E%3Cpath d='M0 30L6.02 30L6.02 36.02L0 36.02Z'/%3E%3Cpath d='M36 -6L42.02 -6L42.02 0.02L36 0.02Z'/%3E%3Cpath d='M36 30L42.02 30L42.02 36.02L36 36.02Z'/%3E%3Cpath d='M6 -6L12.02 -6L12.02 0.02L6 0.02Z'/%3E%3Cpath d='M6 30L12.02 30L12.02 36.02L6 36.02Z'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Pixel art
152 họa tiết
 rotate(0) scale(1)'%3E%3Crect width='200' height='200' fill='%23fefefe'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M-12.62 37.98L-5.92 7.91L54.93 3.15L16.45 64.12L-8.86 48.25Z'/%3E%3Cpath d='M187.38 37.98L194.08 7.91L254.93 3.15L216.45 64.12L191.14 48.25Z'/%3E%3C/g%3E%3Cpath d='M79.89 114.13L104.03 32.58L107.28 31.47L152.73 67.44L110.6 119.82Z' fill='%23777777'/%3E%3Cpath d='M20.15 66.45L58.63 5.48L60.65 3.39L99.1 31.12L74.96 112.67L55.4 117.65L45.84 114.7Z' fill='%23d90429'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M58.41 -70.52L77.97 -75.5L108.68 -69.81L139.22 -49.03L129.24 7.45L105.36 25.83L102.11 26.94L63.66 -0.78Z'/%3E%3Cpath d='M58.41 129.48L77.97 124.5L108.68 130.19L139.22 150.97L129.24 207.45L105.36 225.83L102.11 226.94L63.66 199.22Z'/%3E%3C/g%3E%3Cg fill='%23777777'%3E%3Cpath d='M184.93 -47.13L189.81 6.96L183.11 37.03L134.26 8.33L144.25 -48.14Z'/%3E%3Cpath d='M184.93 152.87L189.81 206.96L183.11 237.03L134.26 208.33L144.25 151.86Z'/%3E%3C/g%3E%3Cpath d='M181.24 40.22L184.99 50.49L153.96 65.9L108.51 29.92L132.38 11.53Z' fill='%23d90429'/%3E%3Cg fill='%23111111'%3E%3Cpath d='M54.83 1.82L-6.03 6.58L-10.91 -47.5L42.03 -72.96L51.6 -70.01L56.84 -0.27Z'/%3E%3Cpath d='M54.83 201.82L-6.03 206.58L-10.91 152.5L42.03 127.04L51.6 129.99L56.84 199.73Z'/%3E%3Cpath d='M254.83 1.82L193.97 6.58L189.09 -47.5L242.03 -72.96L251.6 -70.01L256.84 -0.27Z'/%3E%3Cpath d='M254.83 201.82L193.97 206.58L189.09 152.5L242.03 127.04L251.6 129.99L256.84 199.73Z'/%3E%3C/g%3E%3Cg fill='%23777777'%3E%3Cpath d='M-86.08 122.49L-43.95 70.11L-12.92 54.71L12.4 70.58L38.08 118.83L-14.86 144.29L-55.54 143.27Z'/%3E%3Cpath d='M113.92 122.49L156.05 70.11L187.08 54.71L212.4 70.58L238.08 118.83L185.14 144.29L144.46 143.27Z'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23p)'/%3E%3C/svg%3E)
Tạo sinh
251 họa tiết
Giới thiệu về Trình tạo họa tiết
Trình tạo họa tiết biến gần 2.000 thiết kế dựng sẵn thành những hình nền bạn có thể tinh chỉnh và dùng ngay. Hãy xem 14 bộ sưu tập, từ sóng, chấm bi và phép lát gạch đến tartan, seigaiha của Nhật, sao Hồi giáo, quạt Art Deco, sprite pixel và ngụy trang, và xem từng thiết kế trong màu sắc của riêng bạn.
Mọi thiết kế đều được vẽ dưới dạng đồ họa vector và lặp lại mà không lộ đường nối, ở mọi mức thu phóng và mọi góc. Bạn có thể đổi tối đa sáu màu, thu phóng, vị trí, khoảng cách, độ dày nét và góc, biến các hình đặc thành đường viền, hoặc cho họa tiết chuyển động theo vòng lặp. Các họa tiết tạo sinh như bản đồ địa hình, ô Voronoi và ô Truchet có thể cho ra một biến thể mới sau mỗi lần nhấp.
Khi đã ưng ý, hãy sao chép dưới dạng CSS, SCSS, cấu hình Tailwind, SVG nội tuyến, Data URI hoặc thành phần React, hoặc tải xuống SVG, PNG, JPG hay WebP ở mọi kích thước tới 8000 pixel, kể cả một ô lặp đơn để tự tạo kiểu lặp riêng. Mọi thứ chạy ngay trong trình duyệt của bạn: không có gì được tải lên và không cần tài khoản.
Cách sử dụng Trình tạo họa tiết
- Chọn họa tiết: tìm theo tên, hoặc lọc theo bộ sưu tập và số lượng màu.
- Chọn màu bằng bộ chọn màu, một bảng màu dựng sẵn hoặc “Bảng màu mới”.
- Tinh chỉnh thu phóng, vị trí, khoảng cách, độ dày nét và góc. Khóa bất kỳ giá trị nào bạn thích trước khi nhấn “Gợi cảm hứng”.
- Kiểm tra bằng các chế độ xem trước “Hiện ô lặp”, “Trên trang web” và “Trong văn bản”.
- Sao chép mã hoặc tải tệp xuống, và dùng “Sao chép liên kết” để quay lại đúng họa tiết này sau.