LivIcons
for concrete5
377 icons.
344 live + 33 static. These icons are not images, they are animated Vector Graphics.
New step in interactivity
With power of jQuery and Raphael LivIcons (live icons) brings a fresh look to your site.
Brand New
Such animation methods for interface elements have never been created before.
Animated and static
LivIcons are live, but they can be static too.
Any color, any size
Scalable vector graphics means all icons look awesome at any size.
Retina perfect
LivIcons are vectors, which mean they are presented perfect on high-resolution displays.
16 pixel perfect
LivIcons were created to look perfect even at 16 px (Not in IE6 - IE8).
Bootstrap Buttons / Auto-Nav Pro
Easy to integrate with Bootstrap Buttons and Auto-Nav Pro. See the docs for examples
CTR improvement
LivIcons let you increase CTR (click through ratio) on your sites.
Easy integration
Just copy and paste a snippet of code
LivIcon Generator
A user friendly LivIcon Generator dashboard page provides complete control over each icon.
Free updates
Future LivIcons will be provided free of charge with updates
IE6+ support
LivIcons supports IE6 and up.
All browsers
LivIcons currently support Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 12.1+, Internet Explorer 6.0+, iOS Safari3.2+, Android Browser 3.0+, Blackberry Browser 7.0+
JS Customizer
Optimize LivIcons JavaScript by compiling only the icons you wish to load for your project.
Full Icon List
The following is a list of LivIcons in 32px in the alphabetical order in an each group. Hover an icon to see its animation (not all ones in this demo) and name.
NEW in LivIcons v1.2
Demo Mode!
On this demo site the most part of the icons are in a static mode with disabled animation to prevent an unauthorized use.
To see these NEW icons in action please look at the preview video on the right.
Miscellaneous Web Icons
Demo Mode!
On this demo site the most part of the icons are in a static mode with disabled animation to prevent an unauthorized use. To see all of them in action please look at the LivIcons preview video below.
Arrows and Directional Icons
Demo Mode!
On this demo site the most part of the icons are in a static mode with disabled animation to prevent an unauthorized use. To see all of them in action please look at the LivIcons preview video below.
Text Control Icons
Video Player Icons
Socials, OSs, Browsers, JS libs and others Icons (not animated) - Just Static
Note:
From v1.1 the animation of any ëBrand nameí icons, like socials, browsers, JS libs, etc., is removed because it may violate developersí terms of service of their respective copyright owners. So from now these icons are not animated. I prepare the requests for getting permissions from their owners. If I get positive answers Iíll retrieve animations back to the script. Thanks for the understanding.
Spinner Icons
Demo Mode!
On this demo site the most part of the icons are in a static mode with disabled animation to prevent an unauthorized use. To see all of them in action please look at the LivIcons preview video below.
Morphs Icons
Demo Mode!
On this demo site the most part of the icons are in a static mode with disabled animation to prevent an unauthorized use. To see all of them in action please look at the LivIcons preview video below.
'c' means circle, 'o' - octagon, 's' - square, 't' - triangle
Video Preview of full animated mode
Features
The following is a preview of appearance and behavior of LivIcons.
Any color, any size
LivIcons are based on SVG (scalable vector graphic) in all modern browsers and on VML (Vector Markup Language) in IE6 - IE8. So these icons can be any size with good look at any devices. And, of course, any color can be applied too.
- 16 px
- 24 px
- 32 px
- 48 px
- 56 px
- 64 px
- 96 px
Animated and static
The main feature is LivIcons are animated, but they can be static like any other icons too.
We are animated!
We are static.
Click and hover events
LivIcons support two types of events: 'click' and 'hover'.
We live on 'click'.
We live on 'hover'.
Looped animation
Animation can be repeated infinitely if appropriate.
Please don't get carried away with this option.
Click to start/stop animations.
Original colors by default
This option matches to different icons with traditional colors, such as browsers, social networks etc.
Note: Not animated from v1.1!
Icons with 'original' colors.
Shadowed
For webkit browsers you can apply css filter 'drop-shadow'.
Note: work in Chrome 18.0+, Safari 6.0+, iOS Safari 6.0+, Blackberry Browser 10.0+, Chrome for Android 25.0+
We have a shadow.
Animation start with event on an icon or on its parent
You can trigger events 'click' or 'hover' on an icon itself or on its parent element.
'Onparent' option.
Spinners
For spinner icons the special behavior is defined. If looped they work as traditional spinners.
On this demo 'loop' is disabled. This is pseudo loop, just 10 iterations.
- I'm looped.
- I'm not.
Morphs
Morphs are a special category recomended to use as backgrounds for any desired block.
Note: Childs elements need absolute positioning.
Morphs behavior is totaly different from other icons.
Examples - where to use
Demo Mode!
On this demo site you can see LivIcons with animation in process. This may be distracting, but it's because this is ... the DEMO!
I recommend to use these icons with animation turned on when you really need a strong attention effect.
Examples from the Twitter Bootstrap documentation (animated just for demo)
Use LivIcons in:
- Bulleted lists
- Buttons
- Button groups
- Navigation
- Form fields
- And anywhere you like!
Call-to-action buttons
Different types of promo and intro
Promo 1 example
Why choose us
Vivamus tincidunt accumsan venenatis. Mauris sed od interdum egestas. In hendrerit elit nec urna blandit vehicula.
always on time
Pellentesque dictum nulla a lectus faucibus volutpat. Nullam aliquam, nunc et massa.
quality testing
Donec gravida, est id molestie fringilla, eros diam blandit mi, sit amet lectus eget lorem.
fast delivery
Aliquam erat volutpat. Ut sed lectus eget nulla fringilla rutrum at eu elit gordina.
Promo 2 example
Retina Perfect
Vivamus tincidunt accumsan venenatis. Mauris sed odio et turpis interdum egestas.
HTML5 Ready
Pellentesque dictum nulla a lectus faucibus volutpat. Nullam aliquam, nunc et sollicitudin.
Fully Responsive
Aliquam erat volutpat. Ut sed lectus eget nulla fringilla rutrum at eu elit.
Showcases with special offers
-
Certified and tested
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.
-
Exclusive offer
Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
We accept:
-
Free gift today!
Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in egestas.
Address bar with morphs and socials icons
Stay in Touch
Promo example with morphs icons
Planning and Strategy
Step by Step Realisation
Strict Deadlines
After Sales Support
Well...
-
You
-
decide
-
when
-
and where
© 1998-2014 HostCo Inc. All Rights Reserved
