in English

ꯃꯆꯨꯁꯤꯡ꯫

ꯃꯆꯨꯒꯤ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁ ꯈꯔꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯆꯨꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯔꯊ ꯄꯤꯕꯥ꯫ ꯍꯣꯚꯔ ꯁ꯭ꯇꯦꯇꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯂꯤꯉ꯭ꯀꯁꯤꯡꯒꯤ ꯁꯄꯣꯔꯠ ꯌꯥꯑꯣꯔꯤ, ꯃꯗꯨꯁꯨ ꯌꯥꯑꯣꯔꯤ꯫

ꯁ꯭ꯄꯦꯁꯤꯐꯤꯁꯤꯇꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯊꯦꯡꯅꯕꯥ꯫

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯇꯃꯗꯥ ꯑꯇꯣꯞꯄꯥ ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯒꯤ ꯁ꯭ꯄꯦꯁꯤꯐꯤꯁꯤꯇꯤꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯉꯃꯗꯦ꯫ ꯀꯦꯁ ꯈꯔꯗꯗꯤ, ꯃꯇꯤꯛ ꯆꯥꯕꯥ ꯋꯥꯔꯀꯔꯎꯟꯗ ꯑꯃꯗꯤ ꯅꯍꯥꯛꯀꯤ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯤ ꯀꯟꯇꯦꯟꯇ <div>ꯑꯗꯨ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ aꯗꯥ ꯔꯦꯞ ꯇꯧꯕꯅꯤ꯫

ꯑꯦꯁꯤꯁ꯭ꯇꯦꯟꯇ ꯇꯦꯛꯅꯣꯂꯣꯖꯤꯁꯤꯡꯗꯥ ꯑꯔꯊ ꯄꯤꯕꯥ꯫

ꯑꯔꯊ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ ꯃꯆꯨ ꯁꯤꯖꯤꯟꯅꯕꯅꯥ ꯚꯤꯖꯨꯑꯦꯜ ꯏꯟꯗꯤꯀꯦꯁꯟ ꯑꯃꯥ ꯈꯛꯇꯃꯛ ꯄꯤꯔꯤ, ꯃꯁꯤ ꯑꯦꯁꯤꯁ꯭ꯇꯦꯟꯇ ꯇꯦꯛꯅꯣꯂꯣꯖꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯔꯤꯕꯁꯤꯡꯗꯥ – ꯁ꯭ꯛꯔꯤꯟ ꯔꯤꯗꯔꯒꯨꯝꯕꯥ – ꯌꯧꯍꯅꯕꯥ ꯉꯝꯂꯣꯏ꯫ .sr-onlyꯃꯆꯨ ꯑꯗꯨꯅꯥ ꯇꯥꯀꯄꯥ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ ꯑꯗꯨ ꯀꯟꯇꯦꯟꯇ ꯃꯁꯥꯃꯛꯇꯒꯤ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯎꯕꯥ ꯐꯪꯂꯤꯕꯥ ꯇꯦꯛꯁꯠ ꯑꯗꯨꯗꯒꯤ) ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ ꯎꯕꯥ ꯐꯪꯏ ꯍꯥꯌꯕꯥ ꯁꯣꯌꯗꯅꯥ ꯈꯪꯗꯣꯀꯎ, ꯅꯠꯠꯔꯒꯥ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯂꯣꯠꯁꯤꯜꯂꯕꯥ ꯑꯍꯦꯅꯕꯥ ꯇꯦꯛꯁꯇꯒꯨꯝꯕꯥ ꯑꯂꯇꯔꯅꯦꯇꯤꯚ ꯑꯣꯏꯕꯥ ꯄꯥꯝꯕꯩꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯌꯥꯎꯍꯅꯕꯥ꯫

ꯝꯆꯨ

.ꯇꯦꯛꯁ-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ ꯑꯣꯏꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯁꯦꯀꯦꯟꯗꯔꯤ ꯑꯣꯏꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯁꯥꯛꯁꯦꯁ ꯇꯧꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯈꯨꯗꯣꯡꯊꯤꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯋꯥꯔꯅꯤꯡ ꯇꯧꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯏꯅꯐꯣ꯫

.ꯇꯦꯛꯁ-ꯂꯥꯏꯠ ꯇꯧꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯑꯟꯙ꯭ꯔ ꯇꯧꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯕꯣꯗꯤ ꯑꯣꯏꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯃ꯭ꯌꯨꯇꯦꯗ ꯑꯣꯏꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯍꯣꯏꯠ ꯑꯣꯏꯕꯥ꯫

.ꯇꯦꯛꯁ-ꯕ꯭ꯂꯦꯛ-꯵꯰ ꯂꯩ꯫

.ꯇꯦꯛꯁ-ꯍꯣꯏꯠ-꯵꯰

<p class="text-primary">.text-primary</p>
<p class="text-secondary">.text-secondary</p>
<p class="text-success">.text-success</p>
<p class="text-danger">.text-danger</p>
<p class="text-warning">.text-warning</p>
<p class="text-info">.text-info</p>
<p class="text-light bg-dark">.text-light</p>
<p class="text-dark">.text-dark</p>
<p class="text-body">.text-body</p>
<p class="text-muted">.text-muted</p>
<p class="text-white bg-dark">.text-white</p>
<p class="text-black-50">.text-black-50</p>
<p class="text-white-50 bg-dark">.text-white-50</p>

ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯇꯦꯛꯁꯠ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯅꯁꯨ ꯄꯤꯔꯤꯕꯥ ꯍꯣꯚꯔ ꯑꯃꯁꯨꯡ ꯐꯣꯀꯁ ꯁ꯭ꯇꯦꯇꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯦꯉ꯭ꯀꯔꯁꯤꯡꯗꯥ ꯐꯖꯅꯥ ꯊꯕꯛ ꯇꯧꯏ꯫ ꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯑꯟꯗꯔꯂꯥꯏꯅꯒꯤ ꯃꯊꯛꯇꯥ ꯑꯍꯦꯅꯕꯥ ꯂꯤꯉ꯭ꯛ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯦ ꯍꯥꯌꯕꯥ ꯈꯉꯕꯤꯌꯨ꯫.text-white.text-muted

<p><a href="#" class="text-primary">Primary link</a></p>
<p><a href="#" class="text-secondary">Secondary link</a></p>
<p><a href="#" class="text-success">Success link</a></p>
<p><a href="#" class="text-danger">Danger link</a></p>
<p><a href="#" class="text-warning">Warning link</a></p>
<p><a href="#" class="text-info">Info link</a></p>
<p><a href="#" class="text-light bg-dark">Light link</a></p>
<p><a href="#" class="text-dark">Dark link</a></p>
<p><a href="#" class="text-muted">Muted link</a></p>
<p><a href="#" class="text-white bg-dark">White link</a></p>

ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯃꯆꯨ꯫

ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯇꯦꯛꯁꯠ ꯀꯂꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯅꯥ, ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯑꯗꯨ ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯀ꯭ꯂꯥꯁ ꯑꯃꯍꯦꯛꯇꯗꯥ ꯐꯖꯅꯥ ꯁꯦꯠ ꯇꯧ꯫ ꯑꯦꯉ꯭ꯀꯔ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡ ꯑꯁꯤ ꯇꯦꯛꯁꯠ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯨꯝꯅꯥ ꯍꯣꯚꯔꯗꯥ ꯑꯃꯝꯕꯥ ꯊꯣꯛꯀꯅꯤ꯫ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯁꯦꯠ ꯇꯧꯗꯦcolor , ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯀꯦꯁ ꯈꯔꯗꯥ ꯅꯍꯥꯛꯅꯥ .text-*ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯄꯥꯝꯂꯒꯅꯤ꯫

.ꯕꯤ.ꯖꯤ.-ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ ꯑꯣꯏꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯁꯦꯀꯦꯟꯗꯔꯤ ꯑꯣꯏꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯃꯥꯏꯄꯥꯀꯄꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯈꯨꯗꯣꯡꯊꯤꯕꯥ ꯂꯩ꯫
.ꯕꯤ.ꯖꯤ.-ꯋꯥꯔꯅꯤꯡ ꯇꯧꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯏꯅꯐꯣ꯫
.ꯕꯤ.ꯖꯤ.-ꯂꯥꯏꯠ ꯑꯣꯏꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯑꯟꯙ꯭ꯔ ꯑꯣꯏꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯍꯣꯏꯠ ꯑꯣꯏꯕꯥ꯫
.ꯕꯤ.ꯖꯤ.-ꯇ꯭ꯔꯥꯟꯁꯄꯔꯦꯟꯇ ꯑꯣꯏꯕꯥ꯫
<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
<div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
<div class="p-3 mb-2 bg-transparent text-dark">.bg-transparent</div>

ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ꯫

(ꯗꯤꯐꯣꯜꯇ ꯑꯁꯤ )ꯗꯥ $enable-gradientsꯁꯦꯠ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ , ꯅꯍꯥꯛꯅꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ꯫ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯏꯅꯦꯕꯜ ꯇꯧꯅꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯁ ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯈꯉꯕꯤꯌꯨ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯗꯒꯤ ꯍꯦꯅꯕꯥ꯫truefalse.bg-gradient-

  • .bg-gradient-primary
  • .bg-gradient-secondary
  • .bg-gradient-success
  • .bg-gradient-danger
  • .bg-gradient-warning
  • .bg-gradient-info
  • .bg-gradient-light
  • .bg-gradient-dark