Trianglify 是一个能够生成五颜六色的三角形图案的 JavaScript 库，可以用来作为 SVG 图像和 CSS 背景。它的灵感来自于 Btmills 的 Geopattern，并使用 d3.js 建立多边形的 SVG 图形和使用 SVG 过滤器进行渲染。它还包括 colorbrewer 调色板库，让您快速启动和运行。

立即下载     在线演示

您可能感兴趣的相关文章

本文链接：Trianglify - 生成各种漂亮的 SVG 背景图片

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

Trianglify - 生成五彩缤纷的 SVG 背景图案的更多相关文章

  1. Trianglify – 五彩缤纷的 SVG 背景图案

    Trianglify 是一个能够生成五颜六色的三角形图案的 JavaScript 库,可以用来作为 SVG 图像和 CSS 背景.它的灵感来自于 Btmills 的 Geopattern,并使用 d3 ...

  2. CSS3 实现复杂的背景图案

    灵活的背景定位 实现效果: 将背景图定位到距离容器底边 10px 且距离右边 20px 的位置. background-position 方案 代码: <div>海盗密码</div& ...

  3. Hero Patterns - 聚合各种 SVG 背景纹理素材的网站

    Hero Patterns 是一个聚合了各种 SVG 背景纹理素材的网站,提供的多样的素材可以给你的网站带去特色. SVG 是一种分辨率无关的图形(矢量图形).这意味着它在任何类型的屏幕都不会遭受任何 ...

  4. SVG.js 图案使用和use引用

    一.SVG.Pattern 图案设置 var draw = SVG('svg1').size(300, 300); //SVG.Pattern 图案设置 var pattern = draw.patt ...

  5. js 生成随机炫彩背景

    在浏览 https://ghost.org/xxxx/ 时. 可以使用 background-size: cover; 加上很小的像素图,放大后实现炫彩背景效果. 使用 js canvas 随机生成小 ...

  6. CSS揭秘之《背景图案》

    网格 html { background: #58a; background-image: linear-gradient(white 2px, transparent 0), linear-grad ...

  7. 百度地图API：利用瓦片生成工具，自定义背景图片

    参考酸奶小妹的博文<[百度地图API]如何制作一张魔兽地图!!——CS地图也可以,哈哈哈> (http://www.cnblogs.com/milkmap/archive/2011/05/ ...

  8. 前端生成水印之SVG方式

    SVG:可缩放矢量图形(英语:Scalable Vector Graphics,SVG)是一种基于可扩展标记语言(XML),用于描述二维矢量图形的图形格式. SVG由W3C制定,是一个开放标准. (f ...

  9. 如何生成log新信息背景图片和在图片上添加水印

    在图片上添加文字水印,其实就是要用到两个类, using System.Drawing;             using System.Drawing.Drawing2D; 废话不多说了,直接上代 ...

随机推荐

  1. 【WP 8.1开发】如何把自定义字体塞进应用里

    或许,系统自带的字体不足以体现应用程序的魅力,对于表现极强的汉字来说,更是如此.这时候,我们就会想,要是能把网上下载的艺术字体塞到应用包中,那岂不美哉?那么,这可以实现吗?答案是Yes的. 接下来,阿 ...

  2. CentOS6.5使用createrepo搭建本地源

    本地搭建本地yum源采用的rpm全部来自CentOS-6.5-bin-DVD1&DVD2; 我的是在虚拟机环境安装,先检查我的操作系统版本: 1 2 3 4 [adam@ultraera ~] ...

  3. 炫！一组单元素实现的 CSS 加载进度提示效果

    之前的文章个大家分享过各种类型的加载效果(Loading Effects),这里再给大家奉献一组基于单个元素实现的 CSS 加载动画集合.这些加载效果都是基于一个 DIV 元素实现的,十分强悍. 温馨 ...

  4. Javascript对象创建

    一.概述 虽然对象字面量可以用来创建对象,但在创建多个类似的对象时,不够优雅,不符合DRY原则. 二.创建对象 有以下几种模式: 1.工厂模式 2.构造函数模式 3.原型模式 4.组合构造函数和原型模 ...

  5. ES6模块的import和export用法总结

    ES6之前以前出现了js模块加载的方案,最主要的是CommonJS和AMD规范.commonjs前者主要应用于服务器,实现同步加载,如nodejs.AMD规范应用于浏览器,如requirejs,为异步 ...

  6. TFS签入签出规范

    TFS签入签出规范1)开发平台的约定a)开发操作系统环境和最终用户使用环境 包含Service Pack版本号开发环境 Windows2008SP1 Windows7用户环境 Windows2008S ...

  7. 360手机卫士会影响Widget的运行

    最近开发了一个Widget,老是运行时间长了就会出现NullPointerException错误,一直不知道是什么原因造成的,后来把Widget加入360一键清理的保护名单,错误就少很多,但是仍然有错 ...

  8. 取得 APP 自己的版本号 (狠跨 4 个平台)

    XE7 源码下载:[原创]取得APP自己的版本号(狠跨4个平台)XE7.zip XE6 源码下载:[原创]取得APP自己的版本号(狠跨4个平台)XE6.zip XE5 源码下载:[原创]取得APP自己 ...

  9. 非常不错的Navigation Bar效果

    非常不错的Navigation Bar效果,该源码转载于源码天堂的,大家可以了解一下吧,多视图应用程序中,我们常常使用到自定义UINavigationBar来完成导航条的设置. 源码我就不上传了,大家 ...

  10. 阿里前端框架Alice是个不错的选择

    BootStrap虽然用户群体广大,其整体风格尽管有不少skin可选,但以国情来看还是不好看. 阿里开源的前端框架,个人觉得还是很不错,Alice处处透着支付宝中界面风格的气息,电商感挺强. 以下内容 ...