recentpopularlog in

piperh : generator   71

Shapy | Gradient Generator
gradient shape editor that generates the css code
webdesign  web  design  css  gradient  tool  editor  generator  code  experiment  try  test 
10 weeks ago by piperh
cubic-bezier(.17,0,0,1.03) ✿ cubic-bezier.com
shows numbers for cubic bezier curve. You move handles 'til you get the animation you want, then copy the curve numbers for a css transform
webdesign  web  design  ease  cubic-bezier  cubic  bezier  css  curve  generator  transform 
12 weeks ago by piperh
Pie Charts · ChartGen
brilliant chart generator - you input the data, gives code as svg. Pie charts, bar graphs, line graphs. Would be great for PIRC charts. Use image in Quark to draw on top, or import svg file into Affinity.
webdesign  web  design  graphic  chart  generator  bar  graph  line  pie  svg 
january 2019 by piperh
CSS Accordion Slider: A tool for generating accordion sliders
Handy code generator for accordion style panels. You can only have one open at a time - open one, the previous closes. css only, no js. Some options can be configured first via sliders. Horizontal and vertical options.
webdesign  web  design  css  html  code  generator  configure 
january 2019 by piperh
Meta Tags — Preview, Edit and Generate
they say: With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!
Tool for generating meta tags
webdesign  web  design  webdev  development  meta  tag  generator  twitter  google  facebook  seo  tool 
january 2019 by piperh
Discover Unique - Save time and make smarter font choices!
as far as I can tell this tool generates variations (distortions of existing fonts, and they call them unique fonts
webdesign  web  design  graphic  font  typography  generator 
january 2019 by piperh
Cool Backgrounds
interesting backgrounds: trianglify etc plus the web code for installing on a site
webdesign  web  design  graphic  background  image  colour  gradient  animated  generator  code 
january 2019 by piperh
Fancy Border Radius Generator
generates code for corner radius (border-radius) using 8-figure syntax. You can experiment and get interesting effects, 'specially setting one or more corner to 0. Has draggable corner points. Handy.
webdesign  web  design  code  generator  border-radius  border  corner  radius  shape 
october 2018 by piperh
CSS Duotone Generator
playground for css image blend effects. Photoshop-like blending modes. Give duotone-like effects. Generate the html and css
webdesign  web  design  css  blend  duotone  generator  effect  colour  html 
september 2018 by piperh
Create your Icon Font in seconds - 9000 Vector Icons Available - Free Icon Font Generator
free and paid icon sets. Hosted fonts. I'm not sure if you can download and host your own
webdesign  web  design  icon  font  icons  generator 
august 2018 by piperh
ImageKit.io - Real-time Image Optimization and Global Image CDN
their headlines: Automate image optimization on all platforms
Intelligent real time image optimization, resizing, cropping and super fast delivery.
Generates correct size image on the fly on demand for your website. Lives on a CDN
webdesign  web  design  webdev  images  generate  generator  size  optimise  optimisation  service  online 
august 2018 by piperh
Privacy & Cookie Policy Generator | iubenda
GDPR stuff generator. Paid service, different levels. They do all the processing and remembering of users' permissions / consent
webdesign  web  design  webdev  cookie  policy  gdpr  consent  generator  privacy  comply  compliant  legal 
june 2018 by piperh
Duotone Effect Generator
you can upload photos and see instant duotone effects, and download treated image
design  graphic  image  photo  duotone  generator  colour  resource  tool  online 
june 2018 by piperh
CSS Gradient
css colour gradient generator. Generates hex and rgb, but not hsl. Has some premade favourites
webdesign  web  design  color  colour  gradient  generator  css  code 
march 2018 by piperh
Why Gradients are back to rule in 2018? – UX Planet
Article is too simple and simplistic but useful list of gradient generators near end
webdesign  web  design  graphic  colour  gradient  generator  online  tools  reference  blend 
march 2018 by piperh
Free customizable SVG Backgrounds
a set of svg patterns for backgrounds. Adjustable on the web page - colour, angle, opacity, scale, and generates the css
webdesign  web  design  background  svg  pattern  code  generator 
february 2018 by piperh
Clippy — CSS clip-path maker
handy code generator for css clip-path. Live demo of result + copyable code. (Use this to generate polygons for css shape-outside?)
webdesign  web  design  code  coding  clip-path  image  css  generator  shape  points 
february 2018 by piperh
Vivify - CSS Animation Library
CSS animation library. A list of different animations you can generate code for, with a demo. All css I think, no js. Some nice effects
webdesign  web  design  css  animations  animate  code  generator  effects  library 
november 2017 by piperh
Stuff at the Top of an SVG – Peter Nowell – Medium
article explaining the doctype and other stuff at beginning of svg code. Shows what can be removed and what can't. Mentions viewbox etc but doesn't explain anything
webdesign  web  design  svg  code  doctype  about  version  xmlns  xml  generator  doc 
june 2017 by piperh
Griddy
a css grid playground. Change values and new display and code is generated. Handy for understanding how it works and getting the code generated for you. 21.5.17 works in Firefox not my Chrome (haven't tried Safari or Edge)
webdesign  web  design  tool  css  grid  online  code  generator  display  learn  development 
may 2017 by piperh
CSS Generator Tool - CSS Demonstration and Generation
generates css code for various functions - you can test each setting first using live sliders, and the generated code changes in real time.
webdesign  web  design  css  filter  transform  shadow  border  text  generate  generator  code  test  live  experiment 
may 2017 by piperh
Animista
neat site showing css animations, with feature to change components and see the effect. Then generate the code and download
webdesign  web  design  animate  animation  css  code  playground  tool  generate  generator  experiment  live  effect  test 
march 2017 by piperh
Flexible Boxes
web tool to generate code for flexbox layout
webdesign  web  design  flex  flexbox  code  coding  css  generator  generate  tool  online  layout 
december 2016 by piperh
jsPDF - HTML5 PDF Generator | Parallax
they say: A HTML5 client-side solution for generating PDFs. Perfect for event tickets, reports, certificates, you name it!
webdesign  web  design  js  javascript  pdf  generator  generate 
october 2016 by piperh
Social Media Sharing Buttons. No JavaScript. No tracking. Super fast and easy.
generates file sharing buttons html and css that don't use js and don't download tracking stuff. Less http requests, smaller files.
webdesign  web  design  social  media  share  sharing  button  facebook  fb  twitter  pinterest  google+  tumblr  http  request  generator 
august 2016 by piperh
Clippy — CSS clip-path maker
brilliant code generator for css clip-path.
20.7.16: BUT clip-path not supported in Firefox or Edge or any Explorer
webdesign  web  design  css  clip  clip-path  path  code  generator  generate  tool  online 
july 2016 by piperh
[no title]
generates hipster lorem ipsum
web  graphic  design  layout  dummy  placeholder  text  false  latin  generator 
july 2016 by piperh
AdLush - one click ad generator
Automatic ad generator for banners. Options to generate in different formats and sizes for different uses. Could be great in an emergency
webdesign  web  design  ad  banner  generator  code  format  mobile  tablet  desktop 
june 2016 by piperh
Bricks.js
masonry type of block builder for fixed width elements. No dependencies. No css
webdesign  web  design  javascript  masonry  layout  script  generator  library 
march 2016 by piperh
Designers: Start Coding With uilang - Smashing Magazine
good article explaining use of uilang.js, but also showing good css effects of transition and transform. Some very nice stuff
webdesign  web  design  javascript  uilang  ui  js  code  coding  generator  css  transition  transform  effects  webdev  development  tutorial  howto 
february 2015 by piperh
uilang transpiler
uilang's code generator - enables you to produce the full javascript code and paste that in to your html - saves installing uilang.js
Better for learning perhaps. You still need to create your own css for the effects.
webdesign  web  design  javascript  js  code  transpiler  generator 
february 2015 by piperh
uilang
easy way to code simple javascript events (clicks only). Use more intuitive syntax and the js translates it into proper javascript. Also there's a link here to his transpiler, so you can produce then paste in the full code. No external dependencies
webdesign  web  design  javascript  generator  click  listen  event  ui  js  css  friendly  interface 
february 2015 by piperh
IcoMoon App - Icon Font & SVG Generator
allows you to generate icon fonts with only your selected icons - ie, custom, small file, no unused guff. Also remember fontello.com
webdesign  web  design  font  webfont  icon  iconfont  typeface  generator  webdev  svg  typography  @font-face  vector 
september 2014 by piperh
Fontello - icon fonts generator
allows one to generate custom icon font. Great for making small file - no unused characters. Also remember icomoon.io which also allows you to upload your own svg's. Also similar is icomoon.io
webfont  font  web  design  webdesign  icon  iconfont  generator  webdev  svg  typography  typeface 
july 2014 by piperh

Copy this bookmark:





to read