https://github.com/bchanx/logos-in-pure-css

Company logos created in pure CSS.
https://github.com/bchanx/logos-in-pure-css

css icons logo

Last synced: 3 months ago
JSON representation

Company logos created in pure CSS.

• Host: GitHub
• URL: https://github.com/bchanx/logos-in-pure-css
• Owner: bchanx
• License: mit
• Created: 2013-05-29T08:09:54.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2013-05-30T10:47:26.000Z (over 11 years ago)
• Last Synced: 2024-04-14T16:10:39.342Z (7 months ago)
• Topics: css, icons, logo
• Homepage: http://www.bchanx.com/logos-in-pure-css-demo
• Size: 272 KB
• Stars: 740
• Watchers: 55
• Forks: 99
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-css-only - Logos-in-pure-css - Company logos created in pure CSS. (Uncategorized / Uncategorized)

README

        
logos-in-pure-css

=================

![Logos In Pure CSS](https://raw.github.com/bchanx/logos-in-pure-css/master/banner.png)

Company logos created in pure CSS, built in [less](http://www.lesscss.org).  

**See it in action here:** [bchanx.com/logos-in-pure-css-demo](http://www.bchanx.com/logos-in-pure-css-demo)

Usage

-----

The easiest way to use these icons is to import the corresponding .less file in your own .less styling sheet:

```html

@import "relative/path/to/logos-in-pure-css/twitter.less";

```

You can also link the stylesheet via .html (but you'll need a copy of [less.js](https://github.com/cloudhead/less.js/tree/master/dist), tested on > v1.3.3):

```html

```

If you prefer not to use less, you can use the .css file provided:

```html

```

Once imported, copy the accompanying logo .html into your own .html file and the icon should display!

```html

                                      

  


  


  


  


  


  


  


  


  


  


  


  


  




```


To see it this in action, open `demo.html` in your browser.

Sizes

-------

By default, `{{ size }}` supports two different keywords: large and small. This in turn produces a 300x300px or 52x52px icon.  

If you're using less, you can modify the sizes by either changing the `@radius` param, or by defining your own class

and calling the logo mixin() with your desired `@radius` size.

Currently, the .css file only supports large and small icon sizes.

License

-------

This software is free to use under the MIT license.