#svg , Page 1 Of 1 , 6 Links


Freebie: Winter Sports Icons (SVG, PNG) | Codrops

, Nov 8, 2016 - Freebie: Winter Sports Icons (SVG, PNG) | Codrops

A set of 50 vector icons with a winter sports theme. The icons can be easily adjusted and come in SVG format plus optimized, ready-to-use PNG format. Made by Freepik exclusively for Codrops readers.
آیکونهای زمستانی!


How to Create an Interactive Animated SVG Drum Kit | Codrops

, Mar 19, 2016 - How to Create an Interactive Animated SVG Drum Kit | Codrops

A tutorial on how to create an animated and interactive SVG drum kit with GSAP and jQuery.

اجرای موزیک زنده!


Elastic SVG Elements | Codrops

, Dec 21, 2014 - Elastic SVG Elements | Codrops

Some inspiration for elastic components with SVG shape animations for enhanced UI interactions.

المنتهای انعطاف پذیر برای طراحی وب. شیک و مدرن.


Wobbly Slideshow Effect | Codrops

, Oct 31, 2014 - Wobbly Slideshow Effect | Codrops

The slides in this slideshow wobble as they move. The effect is based on Sergey Valiukh's Dribbble shot and was made using Snap.svg and morphing SVG paths.

یک اسلاید شو متفاوت با کمک تصاویر SVG


Structuring, Grouping, and Referencing in SVG – The <g>, <use>, <defs> and <symbol> Elements

, Jul 7, 2014 - Structuring, Grouping, and Referencing in SVG – The <g>, <use>, <defs> and <symbol> Elements

SVG comes with its own ways for structuring a document by means of certain SVG elements that allow us to define, group, and reference objects within the document. These elements make reusing elements easy, while maintaining clean and readable code. In this article we'll go over these elements, highlighting the difference between them and the advantages of each one.

معرفی تگهای <g>, <use>, <defs> و <symbol> برای کمک در خلق تصاویر SVG.


Animating SVG with CSS | CSS-Tricks

, Jul 4, 2014 - Animating SVG with CSS | CSS-Tricks

There isn't just one way to animate SVG. There is the <animate> tag that goes right into the SVG code. There are libraries that help with it like Snap.svg or SVG.js. We're going to look at another way: using inline SVG (SVG code right inside HTML) and animating the parts right through CSS.

I played with this personally recently as my Alma mater Wufoo was looking to freshen up the advertising graphic we're running here. My latest design around here uses SVG quite a bit and I thought this would be another perfect opportunity to use it some more... .

http://codepen.io/chriscoyier/pen/dvjhn/

ساخت تصویر متحرک با CSS و SVG.