Filter on 是一款在线 CSS3 图片滤镜效果可视化工具。包含以下特性:

  • 可在线测试所有 CSS3 过滤值
  • 支持“独立视图” 和 “合成视图”
  • 支持修改图片源地址
  • 可以再每个过滤器属性模拟 hover 效果
  • 可以在“合成视图” 模式合成任意的属性

OSS 部署步骤

初始化 node 环境

运行

npm install

配置七牛

创建一个文件 config/local_env.json:

{
  "qiniu": {
    "accessKey": "....",
    "secretKey": "....",,
    "bucket": "....",,
    "origin": "...."
  }
}

运行命令

npm run deploy

Filteron 是遵循 MIT 开源授权协议,GitHub 地址:https://github.com/bimohxh/filteron

在线体验地址:http://filter.awesomes.cn/