Posted by Free CSS Template + Tutorial 2.0 (2023)
katie ๐Ÿƒ (#106445)

Warrior
View Forum Posts


Posted on
2022-12-29 04:57:14
Welcome to the new and updated version of my CSS template + tutorial!
My original from 2019 is still usable, but a bit outdated and needed some polishing.

> VIEW/DOWNLOAD THE TEMPLATE HERE <

Rules:
โ€ข This template may be used for anything and everything - free codes, pre-mades, commissions, you name it.
โ€ข Please leave the credit in the template intact, unless your coding becomes unrecognizable from it.
โ€ข This is a guide for CSS coding, not things like image hosting or photo editing. Please use Google if you need help with things like that.
โ€ข Feel free to show me CSS you made using my template! It makes me happy.

Resources:
โ€ข W3Schools
Always go here first. Anything and everything you need to know about CSS is here.
โ€ข Live CSS Editor (Chrome)
Allows you to see changes to your CSS instantly, great for when you're working on your code.
โ€ข Unsplash & Pexels
Great high quality, free to use backgrounds.
โ€ข Google Fonts
Fonts MUST be from here to work in the template.
โ€ข Color Palette from Image & Gradient from Image
Generates a color palette or gradient based on your background image.
โ€ข Color Picker
For hex or RGBA codes.

Coding Things to Keep in Mind:
โ€ข The background of an element controls the solid color behind it, the color of an element controls the text.
โ€ข In RGBA codes, the decimal controls transparency of the element. For example, rgba(1, 1, 1, 0.5) = 50% transparency. 1 = opaque, 0 = invisible.
โ€ข Aim for readability. Cursive fonts are great for headers, but are hard to read in description text.
โ€ข Avoid creating eye-burning CSS or a page that may harm others. Be mindful of intensely bright colors, flashing images, etc. Other people have to see your den too!

Tutorial



Hrt Icon 108 players like this post! Like?

Edited on 15/05/23 @ 16:23:01 by katie ๐ŸŒฟ (#106445)

Anxiety Prime™
[11.25.22 RLC] (#191357)


View Forum Posts


Posted on
2024-04-02 09:42:41
They removed that Parr on Google Fonts and updated it, just click "Add font" or "Get font" (something like that, I don't remember exactly as I'm not on my laptop right now)



Hrt Icon 0 players like this post! Like?

Moo (#471528)

Recognizable
View Forum Posts


Posted on
2024-04-12 02:44:02
No matter what i do i cannot get my thingy to work, i cannot see it in the den or the caves..

https://www.dropbox.com/scl/fi/u5wbs7qaoz86j714in7d1/Kaspar-CSS.css?rlkey=er4mb60otlh37errsz5qh3dt6&dl=0

Can someone have a look and tell me if i did anything wrong



Hrt Icon 0 players like this post! Like?

Destiny (#269645)


View Forum Posts


Posted on
2024-04-12 03:51:12
just change the "www" part to "dl" part so it should look like this:

https://dl.dropbox.com/scl/fi/u5wbs7qaoz86j714in7d1/Kaspar-CSS.css?rlkey=er4mb60otlh37errsz5qh3dt6&dl=0



Hrt Icon 0 players like this post! Like?

Forhel [G3 tigon
Pecora MR] (#448596)

Sapphic
View Forum Posts


Posted on
2024-04-14 16:56:04
adding <*link rel="stylesheet" type="text/css" href="LINK" /> and changing www to dl in my link helped



Hrt Icon 0 players like this post! Like?


Edited on 14/04/24 @ 17:09:10 by Forhel (#448596)

KotelToMaslo (#222113)

Bone Collector
View Forum Posts


Posted on
2024-04-23 14:07:46
just asking
can i just change one or two things without making rest of the css? like just change the lioden logo and caves



Hrt Icon 0 players like this post! Like?

โœฆ | ๐˜ƒ๐—ฎ๐—น (#453059)

Evil
View Forum Posts


Posted on
2024-05-05 14:43:48
I was trying to find a font on the Google Fonts thingy. I decided to use Cormorant Garamond but nothing has a little plus next to it?



Hrt Icon 0 players like this post! Like?

•B’s
Grocery• G2 PF
Styx NRLC (#343773)


View Forum Posts


Posted on
2024-05-05 15:15:53
It should say โ€œget fontโ€ and then use the โ€œimportโ€



Hrt Icon 0 players like this post! Like?

โœฆ | ๐˜ƒ๐—ฎ๐—น (#453059)

Evil
View Forum Posts


Posted on
2024-05-05 16:18:47
On dropbox I click the blue rectangle that says share, no option to create a link.



Hrt Icon 0 players like this post! Like?

๐š‡๐šก๐šƒ๐š›๐š’
๐šŒ๐š˜๐š‚๐š๐šŠ
๐š›๐šก๐š‡ (#420291)

Lone Wanderer
View Forum Posts


Posted on
2024-05-19 16:06:43
I don't get a the proper link either. Its pretty long yeah but i can't figure out which part I need.



Hrt Icon 0 players like this post! Like?

4m3li44 (#472031)

Usual
View Forum Posts


Posted on
2024-05-20 07:06:14
hi!! how do i make a CSS on chromebook? i need help



Hrt Icon 0 players like this post! Like?

Destiny (#269645)


View Forum Posts


Posted on
2024-05-20 07:57:41
on dropbox you rightclick the css you want and click copy link



then you change the "www" part to "dl" and your link is ready



Hrt Icon 1 player likes this post! Like?


Edited on 20/05/24 @ 07:58:00 by Destiny (#269645)

๐š‡๐šก๐šƒ๐š›๐š’
๐šŒ๐š˜๐š‚๐š๐šŠ
๐š›๐šก๐š‡ (#420291)

Lone Wanderer
View Forum Posts


Posted on
2024-05-20 08:11:01
I get the url and something else when I did that,, maybe I used the wrong document? i



Hrt Icon 0 players like this post! Like?

Gee (#196201)

Angelic
View Forum Posts


Posted on
2024-05-20 10:37:28
You also change the number in the link! Im not my PC rn to check where it is in the link, but I think you change the 0 to a 1? Or itโ€™s a 1 to a 0



Hrt Icon 0 players like this post! Like?

๐š‡๐šก๐šƒ๐š›๐š’
๐šŒ๐š˜๐š‚๐š๐šŠ
๐š›๐šก๐š‡ (#420291)

Lone Wanderer
View Forum Posts


Posted on
2024-05-20 11:01:19
i think its a 0. either way, its still like that so i might have to find a dropbox alternative



Hrt Icon 0 players like this post! Like?

Destiny (#269645)


View Forum Posts


Posted on
2024-05-20 11:02:04
no, i never change any numbers and it works perfectly on every css i make.



Hrt Icon 0 players like this post! Like?







Memory Used: 638.05 KB - Queries: 2 - Query Time: 0.00051 - Total Time: 0.00904s