Awesome css templates free download
- #Awesome css templates free download for free#
- #Awesome css templates free download how to#
- #Awesome css templates free download for mac#
- #Awesome css templates free download software#
To put an image on a 192x120 canvas, you can use this website. Changing the hue/saturation will make the biggest difference, but you can also play with things like brightness/contrast. Again, Photoshop is my preferred one here, but there are many free image editing softwares. To recolor the logo, you have to use an image editing software. You can find the original logo for recoloring purposes here. To change the Lioden logo, the image must be on a 192x120 canvas. To change the text color of an element, you'll change the hex code wherever it says "color: #000000". You can even use sites like this and this to generate a color palette from your image!
#Awesome css templates free download for free#
For free color picking from a photo, you can use sites like Instant Eyedropper, and there is also a Chrome extension. Photoshop is expensive, though, so I know it isn't available to everyone. I use the eyedropper tool in Photoshop to pick 4-6 colors directly from my background photo and use them in my CSS. You can even just google "rgb color picker" and one will pop right up in the browser. To get hex and RGB codes, you can use a variety of sources.
If you would like a solid, opaque color, simply replace the entire line of rgba with the hex code or change the opacity to 1. So if you want it to be completely transparent, you would use 0, and 0.5 is semi-visible. Anywhere you see rgba(0,0,0,0.6), the three 0s are the RGB code of the color you'd like to use, and the 0.6 is the opacity. Highlighted is the font link you'll paste into the CSS where indicated.Īnd highlighted here is where you'll paste the font CSS where indicated.Ĭhanging the colors to match your background is the bread and butter of CSS coding! To do this, you'll be changing the RGBA and hex codes in the CSS template. Then, click the little + next to the font you'd like to use. Once you get your link, simply paste it where instructed in the CSS template.įor fonts, choose one from Google Fonts. You CAN simply use the image link from whichever site you're getting it from, but I prefer to re-upload it with ShareX or Imgur just to ensure it won't break. :) To implement the background into the CSS, you'll need a link. But, if it's smaller, don't worry, because the CSS will automatically blow it up to fit. You want a nice, high quality background, preferably one that is at least 1920x1080 pixels. After you do, simply copy paste all of it into your own Notepad program!Ī background is one of the most important parts of CSS! My favorite websites for finding backgrounds are Pexels and Unsplash. You can either download the template or open it in your browser.
Step 2 - Copy Paste Template into Notepad You can also use Imgur if you prefer not to download a software.
#Awesome css templates free download software#
My preferred image sharing software is ShareX.
#Awesome css templates free download for mac#
For Mac users, you can use a program called TextEdit. Most PCs come with Notepad by default, and you can download Notepad++ here.
To use CSS on Lioden, you'll need Notepad (or Notepad++), a Dropbox account, and a place to host images. This template is a blank slate - so I have no issues with you using it for paid codes, seeing as it still takes your time and creativity! I am 100% okay with people using this template for CSS commissions! I am not comfortable with people taking my free CSS, slightly altering them, and selling them - they are fully made codes with backgrounds, colors, etc. ^^ You can find my free pre-made CSS here, and my CSS commissions here.Įdit 08/29/20: Due to some confusion, I'd like to clarify - codes made using this template CAN be sold.
#Awesome css templates free download how to#
Hi! Welcome to my free CSS template and tutorial! I'll be going over how to use the template to make your own CSS here, as well as providing some helpful links.