Coder Social home page Coder Social logo

eiriklv / weather-icons Goto Github PK

View Code? Open in Web Editor NEW

This project forked from erikflowers/weather-icons

0.0 2.0 0.0 60.78 MB

123 weather themed icons inspired by Font Awesome and ready for Bootstrap

Home Page: http://erikflowers.github.io/weather-icons/

weather-icons's Introduction

Weather Icons

Version 1.2 - June 1st, 2014

A free, open source icon-font of Weather icons

Weather Icons is a font of 123 weather themed icons, ready to be dropped right into Bootstrap or any other project.

Inspired by Font Awesome, They work in essentially the same way. They are infinitley scalable and any CSS that can be applied to text can be applied to them. All you need to do to insert an icon is add the base class and the specific icon class to an "i" element:

<i class="wi wi-day-lightning"></i>

At this time, there are no other effects/mixins to do advanced icon manipulation yet.

Icon Preview

####View demo and full icon reference

Getting Started

Getting started is easy. First, put the fonts in the directory ABOVE your css directory. By default, the fonts are referencing a ../fonts/ folder that is on the same level as /css. This can be changed via the @WeatherIconPath variable in variables.less

Include in your main .less file weather-icons/weather-icons.less and that is all you need to do.

CSS Only Method

If you just want to add a css file to your project with no Less compiling, you just need to reference the weather-icons.css included in the css folder. If you are not familiar with using Bootstrap, or using Bootstrap in the precompiled Less mode, I would reccommend you give it a try)

Version 1.2

This is my first attempt at a Bootstrap and/or web ready icon-font, so there will be updates and improvements. It is best to download the repo from Github if you want to keep up to date. Please report any issues or requests to the repository here

The icon designs are originally by Lukas Bischoff. The font has been modified slightly for icon-font usage, and turned into a HTML/CSS/LESS addon by me (Erik).

Collaboration

If you feel so inclined to add icon ideas, icon art, or other fixes/changes to how the package works, feel free to help! I'd also love it if someone wanted to make this a component as well for bower, npm, component, etc. No idea how to do that myself (yet).

Credit

None of this would be possible without Bootstrap, Font Awesome and Lukas Bischoff. I just put it all together into a neat package. Cheatsheet provided by Michael Woywod.

Weather Icons licensed under SIL OFL 1.1 โ€” Code licensed under MIT License โ€” Documentation licensed under CC BY 3.0

Contact

Weather Icons is maintained by me, Erik Flowers. Reach me at @Erik_UX or at http://www.helloerik.com.

weather-icons's People

Contributors

erikflowers avatar jamwaffles avatar morrismukiri avatar wesbos avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.