Nuclides
Table of content
What are Nuclides?

Nuclides are parts of the stylesheet source that are not directly useable on their own. This could be mixins, variables like colors and sizes, or settings.

To mark a variable or mixin as a nuclide, annotate it with the @nuclide tag, followed by the name of the nuclide.

Special forms are @color and @mixin.

Brand
Fonts
$base-font-family
Copy variable
Lincoln Electric Primary Font Stack
Value
"Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif
$base-font-weight
Copy variable
Lincoln Electric Primary Font Stack Weight
Value
300
$base-line-height
Copy variable
Lincoln Electric Primary line-height
Value
1.4
Mixins
Fonts
base-font-family($fw: 300)styles.scss
Show example
Lincoln Electric Primary Font - Open Sans
Parameter
Optional
Description
$fw
used to adjust font-weight
@include base-font-family(600); @include base-font-family;
Colors
Brand Color Palette
Color
Variable
Hex
RGBA
Aa
Lincoln Electric Primary Red
$c-secondary-color
#BE1E2E
rgba(190, 30, 46, 1)
Aa
Lincoln Electric Machine Red
$c-secondary-color
#8B0E1A
rgba(139, 14, 26, 1)
Aa
Lincoln Electric Black
$c-black
#000000
rgba(0, 0, 0, 1)
Aa
Lincoln Electric White
$c-white
#FFFFFF
rgba(255, 255, 255, 1)
Aa
Lincoln Electric Khaki
$c-khaki
#D5CA9E
rgba(213, 202, 158, 1)
Aa
Gray 10
$c-gray-10
#E6E6E6
rgba(230, 230, 230, 1)
Aa
Gray 20
$c-gray-20
#CCCCCC
rgba(204, 204, 204, 1)
Aa
Gray 30
$c-gray-30
#B3B3B3
rgba(179, 179, 179, 1)
Aa
Gray 40
$c-gray-40
#999999
rgba(153, 153, 153, 1)
Aa
Gray 50
$c-gray-50
#808080
rgba(128, 128, 128, 1)
Aa
Gray 60
$c-gray-60
#666666
rgba(102, 102, 102, 1)
Aa
Gray 70
$c-gray-70
#4D4D4D
rgba(77, 77, 77, 1)
Aa
Gray 80
$c-gray-80
#333333
rgba(51, 51, 51, 1)
Aa
Gray 90
$c-gray-90
#191919
rgba(25, 25, 25, 1)
Aa
Lincoln Electric Default Text Color
$c-gray-90
#333333
rgba(51, 51, 51, 1)