You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_skins.css 5.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. /*
  2. SKINS
  3. Docs: http://tachyons.io/docs/themes/skins/
  4. Classes for setting foreground and background colors on elements.
  5. If you haven't declared a border color, but set border on an element, it will
  6. be set to the current text color.
  7. */
  8. /* Text colors */
  9. .black-90 { color: var(--black-90); }
  10. .black-80 { color: var(--black-80); }
  11. .black-70 { color: var(--black-70); }
  12. .black-60 { color: var(--black-60); }
  13. .black-50 { color: var(--black-50); }
  14. .black-40 { color: var(--black-40); }
  15. .black-30 { color: var(--black-30); }
  16. .black-20 { color: var(--black-20); }
  17. .black-10 { color: var(--black-10); }
  18. .black-05 { color: var(--black-05); }
  19. .white-90 { color: var(--white-90); }
  20. .white-80 { color: var(--white-80); }
  21. .white-70 { color: var(--white-70); }
  22. .white-60 { color: var(--white-60); }
  23. .white-50 { color: var(--white-50); }
  24. .white-40 { color: var(--white-40); }
  25. .white-30 { color: var(--white-30); }
  26. .white-20 { color: var(--white-20); }
  27. .white-10 { color: var(--white-10); }
  28. .black { color: var(--black); }
  29. .near-black { color: var(--near-black); }
  30. .dark-gray { color: var(--dark-gray); }
  31. .mid-gray { color: var(--mid-gray); }
  32. .gray { color: var(--gray); }
  33. .silver { color: var(--silver); }
  34. .light-silver { color: var(--light-silver); }
  35. .moon-gray { color: var(--moon-gray); }
  36. .light-gray { color: var(--light-gray); }
  37. .near-white { color: var(--near-white); }
  38. .white { color: var(--white); }
  39. .dark-red { color: var(--dark-red); }
  40. .red { color: var(--red); }
  41. .light-red { color: var(--light-red); }
  42. .orange { color: var(--orange); }
  43. .gold { color: var(--gold); }
  44. .yellow { color: var(--yellow); }
  45. .light-yellow { color: var(--light-yellow); }
  46. .purple { color: var(--purple); }
  47. .light-purple { color: var(--light-purple); }
  48. .dark-pink { color: var(--dark-pink); }
  49. .hot-pink { color: var(--hot-pink); }
  50. .pink { color: var(--pink); }
  51. .light-pink { color: var(--light-pink); }
  52. .dark-green { color: var(--dark-green); }
  53. .green { color: var(--green); }
  54. .light-green { color: var(--light-green); }
  55. .navy { color: var(--navy); }
  56. .dark-blue { color: var(--dark-blue); }
  57. .blue { color: var(--blue); }
  58. .light-blue { color: var(--light-blue); }
  59. .lightest-blue { color: var(--lightest-blue); }
  60. .washed-blue { color: var(--washed-blue); }
  61. .washed-green { color: var(--washed-green); }
  62. .washed-yellow { color: var(--washed-yellow); }
  63. .washed-red { color: var(--washed-red); }
  64. .color-inherit { color: inherit; }
  65. .bg-black-90 { background-color: var(--black-90); }
  66. .bg-black-80 { background-color: var(--black-80); }
  67. .bg-black-70 { background-color: var(--black-70); }
  68. .bg-black-60 { background-color: var(--black-60); }
  69. .bg-black-50 { background-color: var(--black-50); }
  70. .bg-black-40 { background-color: var(--black-40); }
  71. .bg-black-30 { background-color: var(--black-30); }
  72. .bg-black-20 { background-color: var(--black-20); }
  73. .bg-black-10 { background-color: var(--black-10); }
  74. .bg-black-05 { background-color: var(--black-05); }
  75. .bg-white-90 { background-color: var(--white-90); }
  76. .bg-white-80 { background-color: var(--white-80); }
  77. .bg-white-70 { background-color: var(--white-70); }
  78. .bg-white-60 { background-color: var(--white-60); }
  79. .bg-white-50 { background-color: var(--white-50); }
  80. .bg-white-40 { background-color: var(--white-40); }
  81. .bg-white-30 { background-color: var(--white-30); }
  82. .bg-white-20 { background-color: var(--white-20); }
  83. .bg-white-10 { background-color: var(--white-10); }
  84. /* Background colors */
  85. .bg-black { background-color: var(--black); }
  86. .bg-near-black { background-color: var(--near-black); }
  87. .bg-dark-gray { background-color: var(--dark-gray); }
  88. .bg-mid-gray { background-color: var(--mid-gray); }
  89. .bg-gray { background-color: var(--gray); }
  90. .bg-silver { background-color: var(--silver); }
  91. .bg-light-silver { background-color: var(--light-silver); }
  92. .bg-moon-gray { background-color: var(--moon-gray); }
  93. .bg-light-gray { background-color: var(--light-gray); }
  94. .bg-near-white { background-color: var(--near-white); }
  95. .bg-white { background-color: var(--white); }
  96. .bg-transparent { background-color: var(--transparent); }
  97. .bg-dark-red { background-color: var(--dark-red); }
  98. .bg-red { background-color: var(--red); }
  99. .bg-light-red { background-color: var(--light-red); }
  100. .bg-orange { background-color: var(--orange); }
  101. .bg-gold { background-color: var(--gold); }
  102. .bg-yellow { background-color: var(--yellow); }
  103. .bg-light-yellow { background-color: var(--light-yellow); }
  104. .bg-purple { background-color: var(--purple); }
  105. .bg-light-purple { background-color: var(--light-purple); }
  106. .bg-dark-pink { background-color: var(--dark-pink); }
  107. .bg-hot-pink { background-color: var(--hot-pink); }
  108. .bg-pink { background-color: var(--pink); }
  109. .bg-light-pink { background-color: var(--light-pink); }
  110. .bg-dark-green { background-color: var(--dark-green); }
  111. .bg-green { background-color: var(--green); }
  112. .bg-light-green { background-color: var(--light-green); }
  113. .bg-navy { background-color: var(--navy); }
  114. .bg-dark-blue { background-color: var(--dark-blue); }
  115. .bg-blue { background-color: var(--blue); }
  116. .bg-light-blue { background-color: var(--light-blue); }
  117. .bg-lightest-blue { background-color: var(--lightest-blue); }
  118. .bg-washed-blue { background-color: var(--washed-blue); }
  119. .bg-washed-green { background-color: var(--washed-green); }
  120. .bg-washed-yellow { background-color: var(--washed-yellow); }
  121. .bg-washed-red { background-color: var(--washed-red); }
  122. .bg-inherit { background-color: inherit; }