All Projects → saeedalipoor → Icono

saeedalipoor / Icono

Licence: mit
One tag One icon, no font or svg, Pure CSS

Programming Languages

SCSS
7915 projects
Less
1899 projects
stylus
462 projects
HTML
75241 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Icono

Cyberpunk-2077-theme-css
This is a theme in CSS3 to simulate the interfaxes of the game CyberPunk 2077.
Stars: ✭ 118 (-97.05%)
Mutual labels:  css3, purecss
Theme Bmw
✋ Smart Voice: Voice for yourself | 微声: 请为自己发声
Stars: ✭ 373 (-90.69%)
Mutual labels:  css3
You Need To Know Css
💄CSS tricks for web developers~
Stars: ✭ 3,777 (-5.69%)
Mutual labels:  css3
Filters.css
CSS only library to apply color filters.
Stars: ✭ 318 (-92.06%)
Mutual labels:  css3
Css Protips
A collection of tips to help take your CSS skills pro
Stars: ✭ 20,279 (+406.34%)
Mutual labels:  css3
Vue3 Jd H5
🔥 Based on vue3.0.0, vant3.0.0, vue-router v4.0.0-0, vuex^4.0.0-0, vue-cli3, mockjs, imitating Jingdong Taobao, mobile H5 e-commerce platform! 基于vue3.0.0 ,vant3.0.0,vue-router v4.0.0-0, vuex^4.0.0-0,vue-cli3,mockjs,仿京东淘宝的,移动端H5电商平台!
Stars: ✭ 328 (-91.81%)
Mutual labels:  css3
Bs Stepper
A stepper for Bootstrap 4.x
Stars: ✭ 261 (-93.48%)
Mutual labels:  css3
Blog
记录前端开发日常点滴。为梦想Coding...
Stars: ✭ 386 (-90.36%)
Mutual labels:  css3
Photon
Clone native desktop UI's like cocoa and develop native feeling applications using web technologies
Stars: ✭ 369 (-90.79%)
Mutual labels:  css3
Pattern.css
CSS only library to fill empty background with beautiful patterns.
Stars: ✭ 3,481 (-13.08%)
Mutual labels:  css3
Codrops Scribbler
A responsive HTML template for coding projects with a clean, user friendly design. Crafted with the latest web technologies, the template is suitable for landing pages and documentations.
Stars: ✭ 302 (-92.46%)
Mutual labels:  css3
Smart Css Grid
SMART CSS GRID - CSS Framework
Stars: ✭ 291 (-92.73%)
Mutual labels:  css3
Vue Shiyanlou
😘基于vue2和vuex的复杂单页面应用,20+页面53个API(仿实验楼)✨✨
Stars: ✭ 342 (-91.46%)
Mutual labels:  css3
Html Css
Curso de HTML5 e CSS3
Stars: ✭ 4,917 (+22.77%)
Mutual labels:  css3
Boomjs
JavaScript实现一个有趣的浏览器图片爆炸动画效果
Stars: ✭ 379 (-90.54%)
Mutual labels:  css3
Dynamic effect
平时练习的一些前端动效,基于HTML5,CSS3,Canvas,Svg
Stars: ✭ 264 (-93.41%)
Mutual labels:  css3
T Shirts
The first OpenSource t-shirts (probably)
Stars: ✭ 300 (-92.51%)
Mutual labels:  css3
Efo
EFO是一个基于SpringBoot和Vue构建的文件分享系统,包括文件的上传与下载,文件的权限管理,远程文件管理等功能。
Stars: ✭ 327 (-91.84%)
Mutual labels:  css3
Rc Bullets
🌈基于CSS3 Animation,使用React构建的弹幕组件
Stars: ✭ 391 (-90.24%)
Mutual labels:  css3
Morphext
A simple, high-performance and cross-browser jQuery rotating / carousel plugin for text phrases powered by Animate.css.
Stars: ✭ 384 (-90.41%)
Mutual labels:  css3

icono

Join the chat at https://gitter.im/saeedalipoor/icono

icono is an icon pack that needs no external resources. Every tags can be an icon made with pure CSS.

Demo

How to use

To get going with icono you can:

$ bower install icono

or

  • Install it with npm:
$ npm install icono

And then load it in your page:

<link rel="stylesheet" href="icono.min.css">

or

You can add icono folder in your project and import icono.less for compile. iconos maincolor can be changed in variable.less.

and then

just add iconos classes to any type of elements that support psuedo-element.

Example:

<i class="icono-mail"></i>

<div class="icono-mail"></div>

<span class="icono-mail"></span>

<whatever class="icono-mail"></whatever>

Also you can change color of icons as simple as set color for an element.

Example:

i.heart{color: red;}

Available classes

  • icono-home
  • icono-mail
  • icono-rss
  • icono-hamburger
  • icono-plus
  • icono-cross
  • icono-check
  • icono-power
  • icono-heart
  • icono-infinity
  • icono-flag
  • icono-file
  • icono-image
  • icono-video
  • icono-music
  • icono-headphone
  • icono-document
  • icono-folder
  • icono-pin
  • icono-smile
  • icono-eye
  • icono-eye-close
  • icono-sliders
  • icono-share
  • icono-sync
  • icono-reset
  • icono-gear
  • icono-signIn
  • icono-signOut
  • icono-support
  • icono-dropper
  • icono-tiles
  • icono-list
  • icono-chain
  • icono-youtube
  • icono-rename
  • icono-search
  • icono-book
  • icono-forbidden
  • icono-trash
  • icono-keyboard
  • icono-mouse
  • icono-user
  • icono-crop
  • icono-display
  • icono-imac
  • icono-iphone
  • icono-macbook
  • icono-imacBold
  • icono-iphoneBold
  • icono-macbookBold
  • icono-nexus
  • icono-microphone
  • icono-asterisk
  • icono-terminal
  • icono-paperClip
  • icono-market
  • icono-clock
  • icono-textAlignRight
  • icono-textAlignCenter
  • icono-textAlignLeft
  • icono-indent
  • icono-outdent
  • icono-frown
  • icono-meh
  • icono-locationArrow
  • icono-plusCircle
  • icono-checkCircle
  • icono-crossCircle
  • icono-exclamation
  • icono-exclamationCircle
  • icono-comment
  • icono-commentEmpty
  • icono-areaChart
  • icono-pieChart
  • icono-barChart
  • icono-bookmark
  • icono-bookmarkEmpty
  • icono-filter
  • icono-volume
  • icono-volumeLow
  • icono-volumeMedium
  • icono-volumeHigh
  • icono-volumeDecrease
  • icono-volumeIncrease
  • icono-volumeMute
  • icono-tag
  • icono-calendar
  • icono-camera
  • icono-piano
  • icono-ruler
  • icono-cup
  • icono-creditCard
  • icono-facebook
  • icono-twitter
  • icono-gplus
  • icono-linkedIn
  • icono-instagram
  • icono-flickr
  • icono-delicious
  • icono-codepen
  • icono-blogger
  • icono-play
  • icono-pause
  • icono-stop
  • icono-rewind
  • icono-forward
  • icono-next
  • icono-previous
  • icono-caretRight
  • icono-caretLeft
  • icono-caretUp
  • icono-caretDown
  • icono-rightArrow
  • icono-leftArrow
  • icono-upArrow
  • icono-downArrow
  • icono-sun
  • icono-moon
  • icono-disqus
  • icono-cart
  • icono-caretRightCircle
  • icono-caretLeftCircle
  • icono-caretUpCircle
  • icono-caretDownCircle
  • icono-caretRightSquare
  • icono-caretLeftSquare
  • icono-caretUpSquare
  • icono-caretDownSquare
  • icono-dribbble
  • icono-sitemap
  • icono-spinner
  • icono-circle
  • icono-ellipsis

Development & Contributing

Using npm install the dependencies:

$ npm install

Run Gulp

$ gulp
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].