Last active
December 11, 2023 16:28
-
-
Save ThaDewey/334909492fe79b90f902eb52934d344c to your computer and use it in GitHub Desktop.
A collection of CSS to use while building a website.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .box-100 { | |
| width:100px; | |
| height:100px; | |
| } | |
| /* Colors */ | |
| .amber, | |
| .hover-amber:hover { | |
| background-color: #ffc107 !important | |
| } | |
| .aqua, | |
| .hover-aqua:hover { | |
| background-color: #00ffff !important | |
| } | |
| .blue, | |
| .hover-blue:hover { | |
| background-color: #2196F3 !important | |
| } | |
| .light-blue, | |
| .hover-light-blue:hover { | |
| background-color: #87CEEB !important | |
| } | |
| .brown, | |
| .hover-brown:hover { | |
| background-color: #795548 !important | |
| } | |
| .cyan, | |
| .hover-cyan:hover { | |
| background-color: #00bcd4 !important | |
| } | |
| .blue-grey, | |
| .hover-blue-grey:hover, | |
| .blue-gray, | |
| .hover-blue-gray:hover { | |
| background-color: #607d8b !important | |
| } | |
| .green, | |
| .hover-green:hover { | |
| background-color: #4CAF50 !important | |
| } | |
| .light-green, | |
| .hover-light-green:hover { | |
| background-color: #8bc34a !important | |
| } | |
| .indigo, | |
| .hover-indigo:hover { | |
| background-color: #3f51b5 !important | |
| } | |
| .khaki, | |
| .hover-khaki:hover { | |
| background-color: #f0e68c !important | |
| } | |
| .lime, | |
| .hover-lime:hover { | |
| background-color: #cddc39 !important | |
| } | |
| .orange, | |
| .hover-orange:hover { | |
| background-color: #ff9800 !important | |
| } | |
| .deep-orange, | |
| .hover-deep-orange:hover { | |
| background-color: #ff5722 !important | |
| } | |
| .pink, | |
| .hover-pink:hover { | |
| background-color: #e91e63 !important | |
| } | |
| .purple, | |
| .hover-purple:hover { | |
| background-color: #9c27b0 !important | |
| } | |
| .deep-purple, | |
| .hover-deep-purple:hover { | |
| background-color: #673ab7 !important | |
| } | |
| .red, | |
| .hover-red:hover { | |
| background-color: #f44336 !important | |
| } | |
| .sand, | |
| .hover-sand:hover { | |
| background-color: #fdf5e6 !important | |
| } | |
| .teal, | |
| .hover-teal:hover { | |
| background-color: #009688 !important | |
| } | |
| .yellow, | |
| .hover-yellow:hover { | |
| background-color: #ffeb3b !important | |
| } | |
| .white, | |
| .hover-white:hover { | |
| background-color: #fff !important | |
| } | |
| .black, | |
| .hover-black:hover { | |
| background-color: #000 !important | |
| } | |
| .grey, | |
| .hover-grey:hover, | |
| .gray, | |
| .hover-gray:hover { | |
| background-color: #9e9e9e !important | |
| } | |
| .light-grey, | |
| .hover-light-grey:hover, | |
| .light-gray, | |
| .hover-light-gray:hover { | |
| background-color: #f1f1f1 !important | |
| } | |
| .dark-grey, | |
| .hover-dark-grey:hover, | |
| .dark-gray, | |
| .hover-dark-gray:hover { | |
| background-color: #616161 !important | |
| } | |
| .pale-red, | |
| .hover-pale-red:hover { | |
| background-color: #ffdddd !important | |
| } | |
| .pale-green, | |
| .hover-pale-green:hover { | |
| background-color: #ddffdd !important | |
| } | |
| .pale-yellow, | |
| .hover-pale-yellow:hover { | |
| background-color: #ffffcc !important | |
| } | |
| .pale-blue, | |
| .hover-pale-blue:hover { | |
| background-color: #ddffff !important | |
| } | |
| .text-amber, | |
| .hover-text-amber:hover { | |
| color: #ffc107 !important | |
| } | |
| .text-aqua, | |
| .hover-text-aqua:hover { | |
| color: #00ffff !important | |
| } | |
| .text-blue, | |
| .hover-text-blue:hover { | |
| color: #2196F3 !important | |
| } | |
| .text-light-blue, | |
| .hover-text-light-blue:hover { | |
| color: #87CEEB !important | |
| } | |
| .text-brown, | |
| .hover-text-brown:hover { | |
| color: #795548 !important | |
| } | |
| .text-cyan, | |
| .hover-text-cyan:hover { | |
| color: #00bcd4 !important | |
| } | |
| .text-blue-grey, | |
| .hover-text-blue-grey:hover, | |
| .text-blue-gray, | |
| .hover-text-blue-gray:hover { | |
| color: #607d8b !important | |
| } | |
| .text-green, | |
| .hover-text-green:hover { | |
| color: #4CAF50 !important | |
| } | |
| .text-light-green, | |
| .hover-text-light-green:hover { | |
| color: #8bc34a !important | |
| } | |
| .text-indigo, | |
| .hover-text-indigo:hover { | |
| color: #3f51b5 !important | |
| } | |
| .text-khaki, | |
| .hover-text-khaki:hover { | |
| color: #b4aa50 !important | |
| } | |
| .text-lime, | |
| .hover-text-lime:hover { | |
| color: #cddc39 !important | |
| } | |
| .text-orange, | |
| .hover-text-orange:hover { | |
| color: #ff9800 !important | |
| } | |
| .text-deep-orange, | |
| .hover-text-deep-orange:hover { | |
| color: #ff5722 !important | |
| } | |
| .text-pink, | |
| .hover-text-pink:hover { | |
| color: #e91e63 !important | |
| } | |
| .text-purple, | |
| .hover-text-purple:hover { | |
| color: #9c27b0 !important | |
| } | |
| .text-deep-purple, | |
| .hover-text-deep-purple:hover { | |
| color: #673ab7 !important | |
| } | |
| .text-red, | |
| .hover-text-red:hover { | |
| color: #f44336 !important | |
| } | |
| .text-sand, | |
| .hover-text-sand:hover { | |
| color: #fdf5e6 !important | |
| } | |
| .text-teal, | |
| .hover-text-teal:hover { | |
| color: #009688 !important | |
| } | |
| .text-yellow, | |
| .hover-text-yellow:hover { | |
| color: #d2be0e !important | |
| } | |
| .text-white, | |
| .hover-text-white:hover { | |
| color: #fff !important | |
| } | |
| .text-black, | |
| .hover-text-black:hover { | |
| color: #000 !important | |
| } | |
| .text-grey, | |
| .hover-text-grey:hover, | |
| .text-gray, | |
| .hover-text-gray:hover { | |
| color: #757575 !important | |
| } | |
| .text-light-grey, | |
| .hover-text-light-grey:hover, | |
| .text-light-gray, | |
| .hover-text-light-gray:hover { | |
| color: #f1f1f1 !important | |
| } | |
| .text-dark-grey, | |
| .hover-text-dark-grey:hover, | |
| .text-dark-gray, | |
| .hover-text-dark-gray:hover { | |
| color: #3a3a3a !important | |
| } | |
| .border-amber, | |
| .hover-border-amber:hover { | |
| border-color: #ffc107 !important | |
| } | |
| .border-aqua, | |
| .hover-border-aqua:hover { | |
| border-color: #00ffff !important | |
| } | |
| .border-blue, | |
| .hover-border-blue:hover { | |
| border-color: #2196F3 !important | |
| } | |
| .border-light-blue, | |
| .hover-border-light-blue:hover { | |
| border-color: #87CEEB !important | |
| } | |
| .border-brown, | |
| .hover-border-brown:hover { | |
| border-color: #795548 !important | |
| } | |
| .border-cyan, | |
| .hover-border-cyan:hover { | |
| border-color: #00bcd4 !important | |
| } | |
| .border-blue-grey, | |
| .hover-border-blue-grey:hover, | |
| .border-blue-gray, | |
| .hover-border-blue-gray:hover { | |
| border-color: #607d8b !important | |
| } | |
| .border-green, | |
| .hover-border-green:hover { | |
| border-color: #4CAF50 !important | |
| } | |
| .border-light-green, | |
| .hover-border-light-green:hover { | |
| border-color: #8bc34a !important | |
| } | |
| .border-indigo, | |
| .hover-border-indigo:hover { | |
| border-color: #3f51b5 !important | |
| } | |
| .border-khaki, | |
| .hover-border-khaki:hover { | |
| border-color: #f0e68c !important | |
| } | |
| .border-lime, | |
| .hover-border-lime:hover { | |
| border-color: #cddc39 !important | |
| } | |
| .border-orange, | |
| .hover-border-orange:hover { | |
| border-color: #ff9800 !important | |
| } | |
| .border-deep-orange, | |
| .hover-border-deep-orange:hover { | |
| border-color: #ff5722 !important | |
| } | |
| .border-pink, | |
| .hover-border-pink:hover { | |
| border-color: #e91e63 !important | |
| } | |
| .border-purple, | |
| .hover-border-purple:hover { | |
| border-color: #9c27b0 !important | |
| } | |
| .border-deep-purple, | |
| .hover-border-deep-purple:hover { | |
| border-color: #673ab7 !important | |
| } | |
| .border-red, | |
| .hover-border-red:hover { | |
| border-color: #f44336 !important | |
| } | |
| .border-sand, | |
| .hover-border-sand:hover { | |
| border-color: #fdf5e6 !important | |
| } | |
| .border-teal, | |
| .hover-border-teal:hover { | |
| border-color: #009688 !important | |
| } | |
| .border-yellow, | |
| .hover-border-yellow:hover { | |
| border-color: #ffeb3b !important | |
| } | |
| .border-white, | |
| .hover-border-white:hover { | |
| border-color: #fff !important | |
| } | |
| .border-black, | |
| .hover-border-black:hover { | |
| border-color: #000 !important | |
| } | |
| .border-grey, | |
| .hover-border-grey:hover, | |
| .border-gray, | |
| .hover-border-gray:hover { | |
| border-color: #9e9e9e !important | |
| } | |
| .border-light-grey, | |
| .hover-border-light-grey:hover, | |
| .border-light-gray, | |
| .hover-border-light-gray:hover { | |
| border-color: #f1f1f1 !important | |
| } | |
| .border-dark-grey, | |
| .hover-border-dark-grey:hover, | |
| .border-dark-gray, | |
| .hover-border-dark-gray:hover { | |
| border-color: #616161 !important | |
| } | |
| .border-pale-red, | |
| .hover-border-pale-red:hover { | |
| border-color: #ffe7e7 !important | |
| } | |
| .border-pale-green, | |
| .hover-border-pale-green:hover { | |
| border-color: #e7ffe7 !important | |
| } | |
| .border-pale-yellow, | |
| .hover-border-pale-yellow:hover { | |
| border-color: #ffffcc !important | |
| } | |
| .border-pale-blue, | |
| .hover-border-pale-blue:hover { | |
| border-color: #e7ffff !important | |
| } | |
| .border-dotted {border-style: dotted;} | |
| .border-dashed {border-style: dashed;} | |
| .border-solid {border-style: solid;} | |
| .border-double {border-style: double;} | |
| .border-groove {border-style: groove;} | |
| .border-ridge {border-style: ridge;} | |
| .border-inset {border-style: inset;} | |
| .border-outset {border-style: outset;} | |
| .border-none {border-style: none;} | |
| .border-hidden {border-style: hidden;} | |
| .border-mix {border-style: dotted dashed solid double;} | |
| .border-white{ border-color: white; } | |
| .border-black{ border-color: black; } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment