All Classes
Please follow this link to view all bootstrap 4 framework classes
Borders
- .border
- .border-0
- .border-x-0
- .border-y-0
- .border-top-0
- .border-right-0
- .border-bottom-0
- .border-left-0
- .border-sm-0
- .border-x-sm-0
- .border-y-sm-0
- .border-top-sm-0
- .border-right-sm-0
- .border-bottom-sm-0
- .border-left-sm-0
- .border-md-0
- .border-x-md-0
- .border-y-md-0
- .border-top-md-0
- .border-right-md-0
- .border-bottom-md-0
- .border-left-md-0
- .border-lg-0
- .border-x-lg-0
- .border-y-lg-0
- .border-top-lg-0
- .border-right-lg-0
- .border-bottom-lg-0
- .border-left-lg-0
- .border-xl-0
- .border-x-xl-0
- .border-y-xl-0
- .border-top-xl-0
- .border-right-xl-0
- .border-bottom-xl-0
- .border-left-xl-0
- .rounded
- .rounded-top
- .rounded-right
- .rounded-bottom
- .rounded-left
- .rounded-circle
- .rounded-0
- .border.border-primary
- .border.border-secondary
- .border.border-success
- .border.border-danger
- .border.border-warning
- .border.border-info
- .border.border-white
- .border.border-third
- .border.border-fourth
- .border.border-fifth
- .border.border-light
- .border.border-dark
- .border.border-gray-100
- .border.border-gray-200
- .border.border-gray-300
- .border.border-gray-400
- .border.border-gray-500
- .border.border-gray-600
- .border.border-gray-700
- .border.border-gray-800
- .border.border-gray-900
Underline
- .underline
- .underline-center
- .underline-right
- .underline-sm
- .underline-lg
- .underline-1
- .underline-2
- .underline-3
- .underline-primary
- .underline-secondary
- .underline-success
- .underline-info
- .underline-warning
- .underline-danger
Backgrounds
- .bg-fixed
- .bg-no-repeat
- .bg-cover
- .bg-center
- .bg-left
- .bg-right
- .bg-xl-none
- .bg-lg-none
- .bg-md-none
- .bg-sm-none
- .bg-primary
- .bg-secondary
- .bg-success
- .bg-info
- .bg-warning
- .bg-danger
- .bg-third
- .bg-fourth
- .bg-fifth
- .bg-light
- .bg-dark
- .bg-gray-100
- .bg-gray-200
- .bg-gray-300
- .bg-gray-400
- .bg-gray-500
- .bg-gray-600
- .bg-gray-700
- .bg-gray-800
- .bg-gray-900
Buttons
- .btn
- .btn.btn-primary
- .btn.btn-secondary
- .btn.btn-success
- .btn.btn-info
- .btn.btn-warning
- .btn.btn-danger
- .btn.btn-third
- .btn.btn-fourth
- .btn.btn-fifth
- .btn.btn-light
- .btn.btn-dark
- .btn.btn-white
- .btn.btn-outline-primary
- .btn.btn-outline-secondary
- .btn.btn-outline-success
- .btn.btn-outline-info
- .btn.btn-outline-warning
- .btn.btn-outline-danger
- .btn.btn-outline-third
- .btn.btn-outline-fourth
- .btn.btn-outline-danger
- .btn.btn-outline-third
- .btn.btn-outline-fourth
- .btn.btn-outline-fifth
- .btn.btn-outline-light
- .btn.btn-outline-dark
- .btn.btn-outline-white
- .btn-lg
- .btn-sm
- .btn-block
- .btn-toolbar
- .btn-group
- .btn-group-lg
- .btn-group-sm
- .btn-group-vertical
Display
- .d-none
- .d-sm-none
- .d-md-none
- .d-lg-none
- .d-xl-none
- .d-inline
- .d-sm-inline
- .d-md-inline
- .d-lg-inline
- .d-xl-inline
- .d-inline-block
- .d-sm-inline-block
- .d-md-inline-block
- .d-lg-inline-block
- .d-xl-inline-block
- .d-block
- .d-sm-block
- .d-md-block
- .d-lg-block
- .d-xl-block
- .d-table
- .d-sm-table
- .d-md-table
- .d-lg-table
- .d-xl-table
- .d-table-cell
- .d-sm-table-cell
- .d-md-table-cell
- .d-lg-table-cell
- .d-xl-table-cell
- .d-flex
- .d-sm-flex
- .d-md-flex
- .d-lg-flex
- .d-xl-flex
- .d-inline-flex
- .d-sm-inline-flex
- .d-md-inline-flex
- .d-lg-inline-flex
- .d-xl-inline-flex
- .d-print-block
- .d-print-inline
- .d-print-inline-block
- .d-print-none
Forms
- .form-control
- .form-control-lg
- .form-control-sm
- .form-control-file
- .form-inline
- .form-check
- .form-check-inline
- .form-check-label
- .form-check-input
- .form-row
- .custom-select
- .custom-control
- .custom-checkbox
- .custom-control-input
- .custom-control-indicator
- .custom-control-description
- .form-group
- .form-text
- .was-validated
- .custom-controls-stacked
- .input-group
- .input-group-addon
- .input-group-lg
- .input-group-sm
- .input-group-btn
Flex
- .justify-content-start
- .justify-content-end
- .justify-content-center
- .justify-content-between
- .justify-content-around
- .justify-content-sm-start
- .justify-content-sm-end
- .justify-content-sm-center
- .justify-content-sm-between
- .justify-content-sm-around
- .justify-content-md-start
- .justify-content-md-end
- .justify-content-md-center
- .justify-content-md-between
- .justify-content-md-around
- .justify-content-lg-start
- .justify-content-lg-end
- .justify-content-lg-center
- .justify-content-lg-between
- .justify-content-lg-around
- .justify-content-xl-start
- .justify-content-xl-end
- .justify-content-xl-center
- .justify-content-xl-between
- .justify-content-xl-around
- .align-items-start
- .align-items-end
- .align-items-center
- .align-items-baseline
- .align-items-stretch
- .align-items-sm-start
- .align-items-sm-end
- .align-items-sm-center
- .align-items-sm-baseline
- .align-items-sm-stretch
- .align-items-md-start
- .align-items-md-end
- .align-items-md-center
- .align-items-md-baseline
- .align-items-md-stretch
- .align-items-lg-start
- .align-items-lg-end
- .align-items-lg-center
- .align-items-lg-baseline
- .align-items-lg-stretch
- .align-items-xl-start
- .align-items-xl-end
- .align-items-xl-center
- .align-items-xl-baseline
- .align-items-xl-stretch
- .align-self-start
- .align-self-end
- .align-self-center
- .align-self-baseline
- .align-self-stretch
- .align-self-sm-start
- .align-self-sm-end
- .align-self-sm-center
- .align-self-sm-baseline
- .align-self-sm-stretch
- .align-self-md-start
- .align-self-md-end
- .align-self-md-center
- .align-self-md-baseline
- .align-self-md-stretch
- .align-self-lg-start
- .align-self-lg-end
- .align-self-lg-center
- .align-self-lg-baseline
- .align-self-lg-stretch
- .align-self-xl-start
- .align-self-xl-end
- .align-self-xl-center
- .align-self-xl-baseline
- .align-self-xl-stretch
- .align-content-start
- .align-content-end
- .align-content-center
- .align-content-around
- .align-content-stretch
- .align-content-sm-start
- .align-content-sm-end
- .align-content-sm-center
- .align-content-sm-around
- .align-content-sm-stretch
- .align-content-md-start
- .align-content-md-end
- .align-content-md-center
- .align-content-md-around
- .align-content-md-stretch
- .align-content-lg-start
- .align-content-lg-end
- .align-content-lg-center
- .align-content-lg-around
- .align-content-lg-stretch
- .align-content-xl-start
- .align-content-xl-end
- .align-content-xl-center
- .align-content-xl-around
- .align-content-xl-stretch
- .flex-row
- .flex-row-reverse
- .flex-column
- .flex-column-reverse
- .flex-sm-row
- .flex-sm-row-reverse
- .flex-sm-column
- .flex-sm-column-reverse
- .flex-md-row
- .flex-md-row-reverse
- .flex-md-column
- .flex-md-column-reverse
- .flex-lg-row
- .flex-lg-row-reverse
- .flex-lg-column
- .flex-lg-column-reverse
- .flex-xl-row
- .flex-xl-row-reverse
- .flex-xl-column
- .flex-xl-column-reverse
- .flex-nowrap
- .flex-wrap
- .flex-wrap-reverse
- .flex-sm-nowrap
- .flex-sm-wrap
- .flex-sm-wrap-reverse
- .flex-md-nowrap
- .flex-md-wrap
- .flex-md-wrap-reverse
- .flex-lg-nowrap
- .flex-lg-wrap
- .flex-lg-wrap-reverse
- .flex-xl-nowrap
- .flex-xl-wrap
- .flex-xl-wrap-reverse
- .order-1
- .order-2
- .order-3
- .order-4
- .order-5
- .order-6
- .order-7
- .order-8
- .order-9
- .order-10
- .order-11
- .order-12
- .order-sm-1
- .order-sm-2
- .order-sm-3
- .order-sm-4
- .order-sm-5
- .order-sm-6
- .order-sm-7
- .order-sm-8
- .order-sm-9
- .order-sm-10
- .order-sm-11
- .order-sm-12
- .order-md-1
- .order-md-2
- .order-md-3
- .order-md-4
- .order-md-5
- .order-md-6
- .order-md-7
- .order-md-8
- .order-md-9
- .order-md-10
- .order-md-11
- .order-md-12
- .order-lg-1
- .order-lg-2
- .order-lg-3
- .order-lg-4
- .order-lg-5
- .order-lg-6
- .order-lg-7
- .order-lg-8
- .order-lg-9
- .order-lg-10
- .order-lg-11
- .order-lg-12
- .order-xl-1
- .order-xl-2
- .order-xl-3
- .order-xl-4
- .order-xl-5
- .order-xl-6
- .order-xl-7
- .order-xl-8
- .order-xl-9
- .order-xl-10
- .order-xl-11
- .order-xl-12
Grid
- .container
- .container-fluid
- .row
- .col
- .col-1
- .col-2
- .col-3
- .col-4
- .col-5
- .col-6
- .col-7
- .col-8
- .col-9
- .col-10
- .col-11
- .col-12
- .col-sm-1
- .col-sm-2
- .col-sm-3
- .col-sm-4
- .col-sm-5
- .col-sm-6
- .col-sm-7
- .col-sm-8
- .col-sm-9
- .col-sm-10
- .col-sm-11
- .col-sm-12
- .col-md-1
- .col-md-2
- .col-md-3
- .col-md-4
- .col-md-5
- .col-md-6
- .col-md-7
- .col-md-8
- .col-md-9
- .col-md-10
- .col-md-11
- .col-md-12
- .col-lg-1
- .col-lg-2
- .col-lg-3
- .col-lg-4
- .col-lg-5
- .col-lg-6
- .col-lg-7
- .col-lg-8
- .col-lg-9
- .col-lg-10
- .col-lg-11
- .col-lg-12
- .col-xl-1
- .col-xl-3
- .col-xl-3
- .col-xl-4
- .col-xl-5
- .col-xl-6
- .col-xl-7
- .col-xl-8
- .col-xl-9
- .col-xl-10
- .col-xl-11
- .col-xl-12
Lists
- .list-unstyled
- .list-inline
- .list-inline-item
- .list
- .list.list-disc
- .list.list-circle
- .list.list-square
- .list.list-decimal
- .list.list-decimal-leading-zero
- .list.list-lower-alpha
- .list.list-upper-alpha
- .list.list-lower-roman
- .list.list-upper-roman
- .list.list-check
- .list.list-arrow
- .list.list-plus
- .list-group
- .list-group-flush
- .list-group-item
- .list-group-item.active
- .list-group-item.disabled
- .list-group-item-action
- .list-group-item-primary
- .list-group-item-secondary
- .list-group-item-success
- .list-group-item-info
- .list-group-item-warning
- .list-group-item-danger
- .list-group-item-third
- .list-group-item-fourth
- .list-group-item-fifth
- .list-group-item-light
- .list-group-item-dark
Spacing
- .m-auto
- .m-0
- .m-1
- .m-2
- .m-3
- .m-4
- .m-5
- .m-sm-auto
- .m-sm-0
- .m-sm-1
- .m-sm-2
- .m-sm-3
- .m-sm-4
- .m-sm-5
- .m-md-auto
- .m-md-0
- .m-md-1
- .m-md-2
- .m-md-3
- .m-md-4
- .m-md-5
- .m-lg-auto
- .m-lg-0
- .m-lg-1
- .m-lg-2
- .m-lg-3
- .m-lg-4
- .m-lg-5
- .m-xl-auto
- .m-xl-0
- .m-xl-1
- .m-xl-2
- .m-xl-3
- .m-xl-4
- .m-xl-5
- .mt-auto
- .mt-0
- .mt-1
- .mt-2
- .mt-3
- .mt-4
- .mt-5
- .mt-sm-auto
- .mt-sm-0
- .mt-sm-1
- .mt-sm-2
- .mt-sm-3
- .mt-sm-4
- .mt-sm-5
- .mt-md-auto
- .mt-md-0
- .mt-md-1
- .mt-md-2
- .mt-md-3
- .mt-md-4
- .mt-md-5
- .mt-lg-auto
- .mt-lg-0
- .mt-lg-1
- .mt-lg-2
- .mt-lg-3
- .mt-lg-4
- .mt-lg-5
- .mt-xl-auto
- .mt-xl-0
- .mt-xl-1
- .mt-xl-2
- .mt-xl-3
- .mt-xl-4
- .mt-xl-5
- .mr-auto
- .mr-0
- .mr-1
- .mr-2
- .mr-3
- .mr-4
- .mr-5
- .mr-sm-auto
- .mr-sm-0
- .mr-sm-1
- .mr-sm-2
- .mr-sm-3
- .mr-sm-4
- .mr-sm-5
- .mr-md-auto
- .mr-md-0
- .mr-md-1
- .mr-md-2
- .mr-md-3
- .mr-md-4
- .mr-md-5
- .mr-lg-auto
- .mr-lg-0
- .mr-lg-1
- .mr-lg-2
- .mr-lg-3
- .mr-lg-4
- .mr-lg-5
- .mr-xl-auto
- .mr-xl-0
- .mr-xl-1
- .mr-xl-2
- .mr-xl-3
- .mr-xl-4
- .mr-xl-5
- .mb-auto
- .mb-0
- .mb-1
- .mb-2
- .mb-3
- .mb-4
- .mb-5
- .mb-sm-auto
- .mb-sm-0
- .mb-sm-1
- .mb-sm-2
- .mb-sm-3
- .mb-sm-4
- .mb-sm-5
- .mb-md-auto
- .mb-md-0
- .mb-md-1
- .mb-md-2
- .mb-md-3
- .mb-md-4
- .mb-md-5
- .mb-lg-auto
- .mb-lg-0
- .mb-lg-1
- .mb-lg-2
- .mb-lg-3
- .mb-lg-4
- .mb-lg-5
- .mb-xl-auto
- .mb-xl-0
- .mb-xl-1
- .mb-xl-2
- .mb-xl-3
- .mb-xl-4
- .mb-xl-5
- .ml-auto
- .ml-0
- .ml-1
- .ml-2
- .ml-3
- .ml-4
- .ml-5
- .ml-sm-auto
- .ml-sm-0
- .ml-sm-1
- .ml-sm-2
- .ml-sm-3
- .ml-sm-4
- .ml-sm-5
- .ml-md-auto
- .ml-md-0
- .ml-md-1
- .ml-md-2
- .ml-md-3
- .ml-md-4
- .ml-md-5
- .ml-lg-auto
- .ml-lg-0
- .ml-lg-1
- .ml-lg-2
- .ml-lg-3
- .ml-lg-4
- .ml-lg-5
- .ml-xl-auto
- .ml-xl-0
- .ml-xl-1
- .ml-xl-2
- .ml-xl-3
- .ml-xl-4
- .ml-xl-5
- .p-0
- .p-1
- .p-2
- .p-3
- .p-4
- .p-5
- .p-sm-0
- .p-sm-1
- .p-sm-2
- .p-sm-3
- .p-sm-4
- .p-sm-5
- .p-md-0
- .p-md-1
- .p-md-2
- .p-md-3
- .p-md-4
- .p-md-5
- .p-lg-0
- .p-lg-1
- .p-lg-2
- .p-lg-3
- .p-lg-4
- .p-lg-5
- .p-xl-0
- .p-xl-1
- .p-xl-2
- .p-xl-3
- .p-xl-4
- .p-xl-5
- .pt-0
- .pt-1
- .pt-2
- .pt-3
- .pt-4
- .pt-5
- .pt-sm-0
- .pt-sm-1
- .pt-sm-2
- .pt-sm-3
- .pt-sm-4
- .pt-sm-5
- .pt-md-0
- .pt-md-1
- .pt-md-2
- .pt-md-3
- .pt-md-4
- .pt-md-5
- .pt-lg-0
- .pt-lg-1
- .pt-lg-2
- .pt-lg-3
- .pt-lg-4
- .pt-lg-5
- .pt-xl-0
- .pt-xl-1
- .pt-xl-2
- .pt-xl-3
- .pt-xl-4
- .pt-xl-5
- .pr-0
- .pr-1
- .pr-2
- .pr-3
- .pr-4
- .pr-5
- .pr-sm-0
- .pr-sm-1
- .pr-sm-2
- .pr-sm-3
- .pr-sm-4
- .pr-sm-5
- .pr-md-0
- .pr-md-1
- .pr-md-2
- .pr-md-3
- .pr-md-4
- .pr-md-5
- .pr-lg-0
- .pr-lg-1
- .pr-lg-2
- .pr-lg-3
- .pr-lg-4
- .pr-lg-5
- .pr-xl-0
- .pr-xl-1
- .pr-xl-2
- .pr-xl-3
- .pr-xl-4
- .pr-xl-5
- .pb-0
- .pb-1
- .pb-2
- .pb-3
- .pb-4
- .pb-5
- .pb-sm-0
- .pb-sm-1
- .pb-sm-2
- .pb-sm-3
- .pb-sm-4
- .pb-sm-5
- .pb-md-0
- .pb-md-1
- .pb-md-2
- .pb-md-3
- .pb-md-4
- .pb-md-5
- .pb-lg-0
- .pb-lg-1
- .pb-lg-2
- .pb-lg-3
- .pb-lg-4
- .pb-lg-5
- .pb-xl-0
- .pb-xl-1
- .pb-xl-2
- .pb-xl-3
- .pb-xl-4
- .pb-xl-5
- .pl-0
- .pl-1
- .pl-2
- .pl-3
- .pl-4
- .pl-5
- .pl-sm-0
- .pl-sm-1
- .pl-sm-2
- .pl-sm-3
- .pl-sm-4
- .pl-sm-5
- .pl-md-0
- .pl-md-1
- .pl-md-2
- .pl-md-3
- .pl-md-4
- .pl-md-5
- .pl-lg-0
- .pl-lg-1
- .pl-lg-2
- .pl-lg-3
- .pl-lg-4
- .pl-lg-5
- .pl-xl-0
- .pl-xl-1
- .pl-xl-2
- .pl-xl-3
- .pl-xl-4
- .pl-xl-5
Table
- .table
- .table-inverse
- .thead-default
- .table-striped
- .table-bordered
- .table-hover
- .table-sm
- .table-active
- .table-responsive
- .table-primary
- .table-secondary
- .table-success
- .table-info
- .table-warning
- .table-danger
- .table-third
- .table-fourth
- .table-fifth
- .table-light
- .table-dark
Typography
- .fw-100
- .fw-200
- .fw-300
- .fw-400
- .fw-500
- .fw-600
- .fw-700
- .fw-800
- .fw-900
- .text-left
- .text-sm-left
- .text-md-left
- .text-lg-left
- .text-xl-left
- .text-center
- .text-sm-center
- .text-md-center
- .text-lg-center
- .text-xl-center
- .text-right
- .text-sm-right
- .text-md-right
- .text-lg-right
- .text-xl-right
- .text-justify
- .text-lowercase
- .text-uppercase
- .text-capitalize
- .font-weight-bold
- .font-weight-normal
- .font-italic
- .h1
- .h2
- .h3
- .h4
- .h5
- .h6
- .display-1
- .display-2
- .display-3
- .display-4
- .text-xl
- .text-lg
- .text-md
- .text-sm
- .text-primary
- .text-secondary
- .text-success
- .text-info
- .text-warning
- .text-danger
- .text-third
- .text-fourth
- .text-fifth
- .text-light
- .text-dark
- .text-gray-100
- .text-gray-200
- .text-gray-300
- .text-gray-400
- .text-gray-500
- .text-gray-600
- .text-gray-700
- .text-gray-800
- .text-gray-900
- .lead
- .blockquote
- .blockquote-footer
Float
- .float-left
- .float-right
- .float-none
- .float-sm-left
- .float-sm-right
- .float-sm-none
- .float-md-left
- .float-md-right
- .float-md-none
- .float-lg-left
- .float-lg-right
- .float-lg-none
- .float-xl-left
- .float-xl-right
- .float-xl-none
Badges
- .badge
- .badge-pill
- .badge-primary
- .badge-secondary
- .badge-success
- .badge-info
- .badge-warning
- .badge-danger
- .badge-third
- .badge-fourth
- .badge-fifth
- .badge-light
- .badge-dark
Cards
- .card
- .card-img-top
- .card-body
- .card-title
- .card-tex
- .card-subtitle
- .card-footer
- .card-img-overlay
- .card-group
- .card-deck
- .card-column
Sizing
- .w-25
- .w-50
- .w-75
- .w-100
- .mw-25
- .h-25
- .h-50
- .h-75
- .h-100
- .mh-100
Alerts
- .alert-heading
- .alert.alert-primary
- .alert.alert-secondary
- .alert.alert-success
- .alert.alert-danger
- .alert.alert-warning
- .alert.alert-info
- .alert.alert-light
- .alert.alert-dark
Modal
- .modal
- .modal-dialog
- .modal-content
- .modal-header
- .modal-title
- .modal-body
- .modal-footer
- .modal-lg
- .modal-sm
Alignment
- .align-baseline
- .align-top
- .align-middle
- .align-bottom
- .align-text-top
- .align-text-bottom
Embeds
- .embed-responsive-item
- .embed-responsive.embed-responsive-21by9
- .embed-responsive.embed-responsive-16by9
- .embed-responsive.embed-responsive-4by3
- .embed-responsive.embed-responsive-1by1
Figures
- .figure
- .figure-img
- .figure-caption
Position
- .fixed-top
- .fixed-bottom
- .sticky-top
Images
- .img-fluid
- .img-thumbnail
Jumbotron
- .jumbotron
- .jumbotron-fluid