LAYOUT PATTERN | DESIGN PATTERN | TOOL PATTERN | PAGE PATTERN
DESIGN PATTERN
-
BLOCK PATTERN
-
Block pattern(menu)
v1 edition Free editionmenu-4column1
v1 edition Free editionmenu-4column2
v1 edition Free editionmenu-4column-pickup
v1 edition Free editionmenu-3column-pickup
v1 editioncard-circle-4
card-circle-3
card-square-4
card-square-3
-
Block pattern(navigation)
v1 edition Free editionnav-link-left
nav-link-center
nav-link-right
nav-link-w-100
nav-link-responsive
tab-link-left
tab-link-center
tab-link-right
tab-link-w-100
-
Block Pattern(pagenation)
-
Block pattern(sidebar / list-group)
v1 edition Free editionsidebar
THEME CONCEPT
DOWNLOAD
INSTALL
HOW TO USE
BLOCK PATTERN
PATTERN PLUGIN
SEO PLUGIN
Q&A
v1 edition Free editionlist-group-item
-
Block pattern(card)
v1 edition Free editioncard-2-column
card-header
card-header
card-3-column
card-header
card-header
card-header
card-4-column
card-header
card-header
card-header
card-header
card-group-2-column
card-group-3-column
card-group-4-column
card-horizontal-w-100
card-title
card-text
card-text
card-textcard-horizontal-w-75
card-title
card-text
card-text
card-textcard-horizontal-w-50
card-title
card-text
card-text
card-textcard-group-horizontal-2-column
card-title
card-text
card-text
card-textcard-title
card-text
card-text
card-textcard-group-horizontal-3-column
card-title
card-text
card-text
card-textcard-title
card-text
card-text
card-textcard-title
card-text
card-text
card-text -
Block pattern(box)
v1 edition Free editionbox-label-w-50
box-label
box
box
boxbox-label-w-75
box-label
box
box
boxbox-label-w-100
box-label
box
box
boxbox-w-50
box-title
box
box
boxbox-w-75
box-title
box
box
boxbox-w-100
box-title
box
box
boxbox-heading-w-75
heading
box
box
boxbox-heading
heading
box
box
boxbox-heading-large-w-75
heading
box
box
boxbox-heading-large
heading
box
box
box -
Block pattern(text-box)
v1 editionbox-memo-grey
box
v1 editionbox-memo-blue
box
v1 editionbox-memo-green
box
v1 editionbox-memo-pink
box
v1 editionbox-memo-yellow
box
box-clip-grey
box
box-clip-blue
box
v1 editionbox-clip-green
box
v1 editionbox-clip-pink
box
v1 editionbox-clip-yellow
box
v1 editionbox-sticky-grey
box
v1 editionbox-sticky-blue
box
v1 editionbox-sticky-green
box
v1 editionbox-sticky-pink
box
v1 editionbox-sticky-yellow
box
alert-primary
alert-primary
alert-primary
alert-primaryalert-secondary
alert-secondary
alert-secondary
alert-secondaryalert-success
alert-success
alert-success
alert-successalert-info
alert-info
alert-info
alert-infoalert-warning
alert-warning
alert-warning
alert-warningalert-danger
alert-danger
alert-danger
alert-dangeralert-light
alert-light
alert-light
alert-lightalert-dark
alert-dark
alert-dark
alert-darkbox-icon-pink
paragraph with icon
box-icon-yellow
paragraph with icon
box-icon-green
paragraph with icon
box-icon-blue
paragraph with icon
box-icon-brown
paragraph with icon
box-icon-grey
alert with icon
-
Block pattern(quote-box)
v1 edition Free editionquote-box-mark
”
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text textreference source
quote-box-icon
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text textreference source
quote-box-balloon
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text text
text text text text text text text text text textreference source
-
Block pattern(balloon)
v1 edition Free editionballoon-top
balioon
v1 edition Free editionballoon-bottom
balloon
v1 edition Free editionballoon-right
balloon
v1 edition Free editionballoon-left
balloon
v1 editionballoon-right-grey
balloon
v1 editionballoon-left-grey
balloon
v1 editionballoon-right-blue
balloon
v1 editionballoon-left-blue
balloon
v1 editionballoon-right-green
balloon
v1 editionballoon-left-green
balloon
v1 editionballoon-right-pink
balloon
v1 editionballoon-left-pink
balloon
v1 editionballoon-right-yellow
balloon
v1 editionballoon-left-yellow
balloon
v1 editionballoon-conversation
chat
balloon
balloon
chat
v1 editionballoon-chat
chat
balloon
-
Block pattern(accordion)
v1 edition Free editionaccordion-1
accordion-body#ac01
accordion-body#ac01
accordion-body#ac01accordion-3
accordion-body#ac001
accordion-body#ac001
accordion-body#ac001
accordion-body#ac002
accordion-body#ac002
accordion-body#ac002
accordion-body#ac003
accordion-body#ac003
accordion-body#ac003 -
Block pattern(alert)
v1 edition Free editionalert-primary-close
alert-primary-close
alert-secondary-close
alert-secondary-close
alert-success-close
alert-success-close
alert-info-close
alert-info-close
alert-warning-close
alert-warning-close
alert-danger-close
alert-danger-close
alert-light-close
alert-light-close
alert-dark-close
alert-dark-close
alert-icon-pink
alert with icon
alert-icon-yellow
alert with icon
-
Block Pattern(table)
v1 edition Free editiontable
v1 edition Free editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless
v1 edition Free editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-dark
v1 edition Free editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-dark
v1 edition Free editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-hover
v1 edition Free editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-dark-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-dark-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-stripe-dark-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-stripe-blue-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-stripe-green-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-stripe-red-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-stripe-yellow-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-stripe-dark-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-stripe-blue-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-stripe-green-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-stripe-red-hover
v1 editionheader header header header 1 1 1 1 2 2 2 2 3 3 3 3 table-borderless-stripe-yellow-hover
header header header header 1 1 1 1 2 2 2 2 3 3 3 3 -
Block pattern(button / dropdown)
コンテンツエリアやフッターなどに配置できるパーツも、ブロックパターンで各種ご用意しています。
btn-primary
btn-secondary
btn-success
btn-info
btn-warning
btn-danger
btn-light
btn-dark
btn-outline-primary
btn-outline-secondary
btn-outline-success
btn-outline-info
btn-outline-warning
btn-outline-danger
btn-outline-light
btn-outline-dark
btn-link
btn-link-w-100
link-group-gap-2
-
Block pattern(badge)
bg-primary
bg-primary
bg-secondary
bg-secondary
bg-success
bg-success
bg-danger
bg-danger
bg-warning
bg-warning
bg-info
bg-info
bg-light
bg-light
bg-dark
bg-dark
bg-primary-rounded
bg-primary-rounded
bg-secondary-rounded
bg-secondary-rounded
bg-success-rounded
bg-success-rounded
bg-danger-rounded
bg-danger-rounded
bg-warning-rounded
bg-warning-rounded
bg-info-rounded
bg-info-rounded
bg-light-rounded
bg-light-rounded
bg-dark-rounded
bg-dark-rounded
-
Block Pattern(large font)
v1 edition Free editiondisplay-1
v1 edition Free editiondisplay-2
v1 edition Free editiondisplay-3
v1 edition Free editiondisplay-4
v1 edition Free editiondisplay-5
v1 edition Free editiondisplay-6
-
Block Pattern(icons) *in preparation
bootstrap icons
bi-facebook
bi-twitter
bi-instagram
bi-youtube
bi-line
bi-tiktok
bi-linkedin
bi-messenger
bi-google
bi-apple
bi-wordpress
bi-people-fill
bi-laptop-fill
bi-laptop
bi-phone-vibrate
bi-phone-vibrate-fill
bi-globe
bi-house-door-fill
bi-link
bi-link-45deg
bi-list
bi-x
bi-search
bi-printer-fill
bi-download
bi-filetype-pdf
bi-envelope-fill
bi-envelope
bi-cart3
bi-cart-check-fill
bi-calculator
bi-credit-card
bi-clock-fill
bi-rss-fill
bi-calendar3
bi-play-circle-fill
bi-paperclip
bi-book-fill
bi-pencil-fill
bi-pin-angle-fill
bi-chat-dots-fill
bi-chat-left-dots-fill
bi-chat-left-text-fill
bi-chat-left-quote-fill
bi-camera-fill
bi-camera-reels-fill
bi-card-image
bi-image-fill
bi-arrow-up-circle-fill
bi-arrow-right-circle-fill
bi-arrow-down-circle-fill
bi-arrow-left-circle-fill
bi-arrow-up-square-fill
bi-arrow-right-square-fill
bi-arrow-down-square-fill
bi-arrow-left-square-fill
bi-exclamation-circle-fill
bi-question-circle-fill
bi-exclamation-triangle-fill
bi-exclamation-triangle
bi-check-square
bi-check-square-fill
bi-check-circle
bi-check-circle-fill
bi-award-fill
bi-hand-thumbs-up-fill
bi-bookmark-fill
bi-bell-fill
bi-record-circle
bi-circle
bi-triangle
bi-x-lg
bi-record-circle-fill
bi-circle-fill
bi-triangle-fill
bi-x-circle-fill
bi-emoji-laughing
bi-emoji-smile
bi-emoji-neutral
bi-emoji-expressionless