Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
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: 22 days 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 (about 11 years ago)
- Default Branch: master
- Last Pushed: 2013-05-30T10:47:26.000Z (about 11 years ago)
- Last Synced: 2024-04-14T16:10:39.342Z (2 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
Lists
- awesome-css-only - Logos-in-pure-css - Company logos created in pure CSS. (Uncategorized / Uncategorized)
- awesome-stars - logos-in-pure-css - Company logos created in pure CSS. (Others)
README
logos-in-pure-css
=================
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.