[Image Dump] Gaia Logos, Contact Buttons, Cursors, etc. | Page 1 | [CSS] Guides and Resources | Guild Forums

Profilist

Captain

Hardworking Regular

Offline

Posted: Thu Oct 13, 2016 7:37 am

[ Image Dump ]

Gaia Logos, Contact Buttons, Cursors, etc.

A collection of images useful for coding layouts.
Some of these come with instructions while others require for you to know how to use them.
All of the images here are free for both personal and commercial use (in terms of profile commissions).

Posted: Thu Oct 13, 2016 4:09 pm

Gaia Online Logos

A collection of logos to use for the Gaia Header. All images have transparent backgrounds (unless noted otherwise)
Remember that the logo cannot be the same color as the background

Basic Code:
#header_left img {width: 0px; padding: 0 45px 0 0; background: url('image url here') bottom left no-repeat;}
You may need to adjust padding or add a background-size property depending on the image you use.

User Image

- RED - http://i.imgur.com/t30FyED.png
User Image

- ORANGE - http://i.imgur.com/2381ytl.png
User Image

- YELLOW - http://i.imgur.com/KbrYpL1.png
User Image

- GREEN - http://i.imgur.com/6CWnseH.png
User Image

- BLUE - http://i.imgur.com/1b0f6Am.png
User Image

- PURPLE - http://i.imgur.com/tRiesJS.png
User Image

- PINK - http://i.imgur.com/h9Z33FV.png
User Image

- BROWN - http://i.imgur.com/DSEgOhP.png
User Image

- BLACK - http://i.imgur.com/CNt52rr.png
User Image

- WHITE - http://i.imgur.com/s0NkOhU.png
User Image

- RAINBOW - http://i.imgur.com/peQ5xxK.png
User Image

- White with Shadow - http://i.imgur.com/wtwGGOm.png
User Image

The original logo, if anyone wants to recolor it

More Logo Collections
Please have the courtesy to re-upload logos onto your own image host.
Do not hot-link Photobucket logos.

Lady Saxophone's Collection: Photobucket Folder
Knight Yoshi's Collection: Photobucket Folder

Profilist

Captain

Hardworking Regular

Offline

Profilist

Captain

Hardworking Regular

Offline

Posted: Thu Oct 13, 2016 4:23 pm

Contact Buttons

Images useful for contact options on your page.
For beginners, it may be easiest to just use the image with BBCode to create a link.
For more advanced coders, you can convert entire panels into buttons linking to various web pages.

User Image

Add |

Message |

Trade |

Comment | Black Icons

User Image

Add |

Message |

Trade |

Comment | White Icons

For more icons, check out Icons DB - hundred of icons in any color which are extremely useful for making buttons.

If you want to convert your Contact panel (on Current layouts) into buttons, you may find the following code useful:
You will need to insert your own background size and image URLs. You may also need to adjust the padding.

#id_contact ul li span, #id_contact ul li a{
font-size: 0;
padding: 10px;
background-color: ;
background-size: ;
background-position: center center;
background-repeat: no-repeat;
}

#id_contact ul li:nth-child(1) span, #id_contact ul li:nth-child(1) a{background-image: url(add image url here)}

#id_contact ul li:nth-child(2) span, #id_contact ul li:nth-child(2) a{background-image: url(message url here)}

#id_contact ul li:nth-child(3) span, #id_contact ul li:nth-child(3) a{background-image: url(trade image url here)}

Posted: Fri Oct 14, 2016 6:26 am

Cursors

Cursors can be fun for layouts, but there are also some problems you can run into with them.
By default, your browser supports a variety of cursors. You can find a list of browser-provided cursors over here.

If you want to use an image for your cursor, you need to keep some limitations in mind:
1) If your cursor image size is over 120px x 120px, your browser will most likely not support it
2) Most browsers do not support .ani (animated) cursors
3) If you use an animated .gif as a cursor image, most browsers will only display the non-animated version of the image

To use your own cursor image, use the following code:
body, a, a:hover{cursor: url('image url here'), progress !important;}

A common resource people use is Cursors 4U
Please note that Cursors 4U contains many copyrighted images, so cursors from there cannot be used for profile commissions.

Profilist

Captain

Hardworking Regular

Offline

Profilist

Captain

Hardworking Regular

Offline

Posted: Fri Oct 14, 2016 6:41 am

Media Gifs

These images come from yukoki on tumblr, but the images are free to use for whatever purpose.
The intended purpose of these images are for your Media panel, but you can use them elsewhere as well.

User Image - Blocked by "Display Image" Settings. Click to show.

User Image - Blocked by "Display Image" Settings. Click to show.

- editing -
gallery

Posted: Fri Oct 14, 2016 7:24 pm

More Resources

WARNING: Unless noted otherwise, all of these sites contain copyrighted images.
Do not use copyrighted images for profile commissions or else you will be breaking site rules.

Backgrounds & Wallpapers
Subtle Patterns / Transparent Textures - Simple repeating backgrounds
Wallpaper Abyss - HQ Wallpapers with no watermarks

Pixels
piq.codeus - Amateur pixel art (usually requires credits)
pixel-soup - tumblr page full of arrows, icons, cursor, etc.
Pixels Galore - another tumblr page full of pixel art
G-REVO - Fancy pixel art by Gasara
Glitter Graphics - Pixels and some regular images, larger in size

Brushes
BrushLovers
Free Photoshop Brushes

Fonts
Google Fonts - Free for Commercial Use
Font Library
DaFont
Font Squirrel
Font Zone

Free for Commercial Use
Websites listed here contain images which can be used for commercial projects (aka profile commissions)
Pixabay - Thousands of HQ photos, vectors, and illustrations
Unsplash - More HQ photos
Freepik - Vectors, PSD, icons, and photos
Vectorific - More vectors
Icons DB - Icons for all sorts of projects
sozaico - Lace and snowflake vectors (requires credits)

Profilist

Captain

Hardworking Regular

Offline

Welcome to Gaia! ::

Gaia Guilds

Profilist Tools

Quick Reply

More Information