カラー見本をこちらに書き直しました↓
初期設定されている関数とカラーコードです。
これを参考に、配色の調整やオリジナル用に追加などを行い、サイトにあったカスタマイズをします。
カラー見本
| class=”bg-primary | –bs-primary: #0d6efd; |
| class=”bg-secondary | –bs-secondary: #6c757d; |
| class=”bg-success | –bs-success: #198754; |
| class=”bg-info | –bs-info: #0dcaf0; |
| class=”bg-warning | –bs-warning: #ffc107; |
| class=”bg-danger | –bs-danger: #dc3545; |
| class=”bg-light | –bs-light: #f8f9fa; |
| class=”bg-dark | –bs-dark: #212529; |
| class=”bg-primary | –bs-primary-rgb: 13, 110, 253; |
| class=”bg-secondary | –bs-secondary-rgb: 108, 117, 125; |
| class=”bg-success | –bs-success-rgb: 25, 135, 84; |
| class=”bg-info | –bs-info-rgb: 13, 202, 240; |
| class=”bg-warning | –bs-warning-rgb: 255, 193, 7; |
| class=”bg-danger | –bs-danger-rgb: 220, 53, 69; |
| class=”bg-light | –bs-light-rgb: 248, 249, 250; |
| class=”bg-dark | –bs-dark-rgb: 33, 37, 41; |
| class=”bg-white | –bs-white-rgb: 255, 255, 255; |
| class=”bg-black | –bs-black-rgb: 0, 0, 0; |
グレースケール
–bs-gray: #6c757d; –bs-gray-dark: #343a40; –bs-gray-100: #f8f9fa; –bs-gray-200: #e9ecef; –bs-gray-300: #dee2e6; –bs-gray-400: #ced4da; –bs-gray-500: #adb5bd; –bs-gray-600: #6c757d; –bs-gray-700: #495057; –bs-gray-800: #343a40; –bs-gray-900: #212529; システムカラー–bs-body-color-rgb: 33, 37, 41; –bs-body-bg-rgb: 255, 255, 255; –bs-body-color: #212529; –bs-body-bg: #fff; –bs-border-color: #dee2e6; –bs-border-color-translucent: rgba(0, 0, 0, 0.175); –bs-link-color: #0d6efd; –bs-link-hover-color: #0a58ca; –bs-code-color: #d63384; –bs-highlight-bg: #fff3cd; |
こちらもよろしく