Menggunakan bootstrap adalah hal yang umum untuk desain web. Tapi kalau kamu tidak perlu semua fitur bootstrap, kamu mungkin akan lebih cocok menambahkan utility class sendiri sesuai kebutuhan.

Menurut saya, yang akan sulit dipahami itu adalah sizing seperti padding-1, margin-3, dst. Umumnya framework CSS punya ukurannya sendiri,

Untuk kebutuhan sederhana, kita akan ganti ukuran angka ini dengan akhiran full, half, quarter, dsb. Ini tentu lebih mudah dipahami. Untuk ukurannya sendiri kita bisa pakai rem.

.pt-full{padding-top:1rem}
.pl-half{padding-lef:0.5rem}
.mt-quarter{margin-top:0.25rem}

Obsoletes

Selanjutnya, kamu mungkin perlu class .obsoletes untuk menghilangkan fitur-fitur yang akan dihapus atau sudah tidak digunakan lagi.

.obsoletes{display:none!important;height:0!important;width:0!important;overflow:hidden!important;visibility:hidden!important;position:absolute!important}

Void

Untuk spacing antar elemen, dulu saya biasanya menambahkan padding atau margin di elemen langsung. Tapi untuk desain yang lebih modular, saya mulai beralih menggunakan elemen khusus dengan class .void.

Void hanyalah elemen div kosong degan margin bottom.

.void-tenth,.void-quarter,.void-half,.void-full{display:flex}
.void-tenth{margin-bottom:0.1rem}.void-quarter{margin-bottom:0.25rem}.void-half{margin-bottom:0.5rem}.void-full{margin-bottom:1rem}

Elemen void cocok untuk spacing antar elemen karena tidak mudah ter-highlight ketika kita inspect elemen.

ini memudahkan untuk melihat area elemen yang sesungguhnya tanpa ditambah spacing antar elemen.

Properti Umum

Terakhir, untuk properti CSS umum lainnya bisa kamu tambahkan sesuai nama propertinya saja.

.flex-column { flex-direction: column; }
.flex-1 { flex: 1; }
.d-flex { display: flex; }
.justify-content-end { justify-content: flex-end; }
.d-flex { display: flex; }
.justify-content-between { justify-content: space-between; }

/* ... dst. */