Text styles define how big our headlines, subheadline, and body copy are. They will also help define warning text and microcopy. It’s important that there is a uniform and cohesive style throught the design.

Logo

Logo-blue

Logo-white

Logo Usage

Dimension

Use the logo unstretched and in the sizes outline above.

Visibility

Do use the blue logo against a white background and the white logo on a colourful background for highest legibility.

Typography

Glyphs:

Characters:

0123456789 ABCDEFGHI JKLMNOPQR STUVWXYZ

0123456789 abcdefghi jklmnopqr stuvwxyz

Desktop Font Size

Description

Hero

Title

Subtitle

Paragraph

Body

Small

Micro

Weight & Size

Open Sans - 56 pt

Open Sans - 32 pt

Open Sans - 24 pt

Open Sans - 18 pt

Open Sans - 16 pt

Open Sans - 14 pt

Open Sans - 12 pt

Special Font Size

Description

Textlink

Warning

Confirmation

Weight & Size

Open Sans - 12 pt

Defining typography allows for consistent sizes, style, and legibility across headlines, subheadlines, and paragraphs.

Other Color

BCA Blue primary - WEBFORM button

#ff944c

BCA Blue Secondary - WEBFORM MYBCA

#28b4e8

BCA Orange

#ff944c

BCA Tosca-anak perusahaan

#2ECACC

Primary

BCA Blue - 500

#0066AE

BCA Blue - 400

#2FA6FC

BCA Blue - 300

#63ACF2

BCA Blue - 200

#AAD2F8

BCA Blue - 100

#F1F5F8

Secondary

BCA Blue - 700

#093967

BCA Blue - 900

#031120

Shades of Gray

Black - 0%

#303030

Dark Gray

#7C7C7C

Gray

#B0B0B0

Light Gray

#EFEFEF

White - 45%

#f7f7f7

System Color

Red - 0%

#D81313

Green

#00893D

System Icon

Our system icons depict common action, file, devices and direction in a clear and modern feel.

icon-finance-bca

16 Pixel

icon-alert icon-input-clear icon-call icon-chevron-up icon-enter icon-left-arrow icon-chat icon-clock icon-exit icon-right-arrow icon-chevron-back icon-correct icon-gift icon-attachment icon-chevron-down icon-cycle icon-globe icon-calendar icon-chevron-next icon-delete icon-headset icon-help icon-incorrect icon-info icon-input icon-key icon-link icon-location icon-lock icon-login icon-love icon-mail icon-map icon-menu icon-minus icon-forward icon-notice icon-notification icon-plus icon-refresh icon-search icon-share icon-shield icon-star icon-tag icon-unduh icon-user icon-view

24 Pixel

32 Pixel

icon-akun icon-bayar icon-buka-rekening icon-hubungan-investor icon-klikbca icon-korporasi icon-kurs icon-layanan icon-promo icon-solusi icon-tata-kelola icon-transfer icon-vira icon-benefit-achivement icon-benefit-applyonline icon-benefit-balance icon-benefit-block-card icon-benefit-business icon-benefit-calculator icon-benefit-calendar icon-benefit-connect icon-benefit-currency icon-benefit-e-banking icon-benefit-e-commerce icon-benefit-easy icon-benefit-everywhere icon-benefit-fast icon-benefit-free icon-benefit-guarantee icon-benefit-halobca icon-benefit-insurance icon-benefit-investment icon-benefit-join icon-benefit-lightly icon-benefit-message icon-benefit-mobile icon-benefit-money icon-benefit-notify icon-benefit-outlet icon-benefit-payment icon-benefit-product-information icon-benefit-profile icon-benefit-registration icon-benefit-safety icon-benefit-setting icon-benefit-shakehand icon-benefit-shopping icon-benefit-target icon-benefit-topup icon-benefit-transfer icon-benefit-wallet icon-benefit-winner icon-location-pin icon-location-weekend-bank icon-location-branch

64 Pixel

icon-button-search icon-big-kurs icon-pendidikan icon-product-acgs-acgs icon-product-asuransi-grow icon-product-asuransi-protection icon-product-asuransi-savings icon-product-corporate-card-bca-card icon-product-corporate-card-visa-card icon-product-hubungan-investor-kronologi icon-product-hubungan-investor-laporan-keuangan icon-product-hubungan-investor-laporan-tahunan icon-product-hubungan-laporan-keberlanjutan icon-product-hubungan-laporan-lainya icon-product-hubungan-laporan-presentasi icon-product-informasi-saham-harga-dan-kinerja icon-product-informasi-saham-kepemilikan-saham icon-product-informasi-saham-riwayat-dvidien icon-product-investasi-obligasi icon-product-nvestasi-rdn icon-product-nvestasi-reksadana icon-product-kebijakan-implementasi icon-product-kkb-mobil-refinancing icon-product-kkb-pembelian-mobil icon-product-korporasi-manajemen icon-product-korporasi-prestasi icon-product-korporasi-sejarah icon-product-kpr-kredit-multiguna icon-product-kpr-pembelian-pertama icon-product-kpr-renovasi icon-product-kredit-usaha-installment-loan icon-product-kredit-usaha-kredit-export icon-product-kredit-usaha-kredit-lokal icon-product-kredit-usaha-kredit-usaha-rakyat icon-product-kredit-usaha-time-loan icon-product-remittance-inward icon-product-remittance-outward icon-product-remittance-worker icon-product-reward-bca-cek-redeem icon-product-reward-bca-daftar-merchant icon-product-reward-bca-kenali icon-product-riset-ekonomi-tentang icon-product-smartcash-kartu-smartcash icon-product-smartcash-rekening-smartcash icon-product-tahaka-simuda icon-product-tahaka icon-product-trade-garansi icon-product-trade-import icon-product-trade-skbdn icon-product-tresuri-dan-kustodian-derivatives icon-product-tresuri-dan-kustodian-fix-icome icon-product-tresuri-dan-kustodian-layanan-kustodian icon-product-tresuri-dan-kustodian-pasar-uang icon-product-tresuri-dan-kustodian-perusahaan-anak icon-product-tresuri-dan-kustodian-valas icon-product-tresuri-dan-kustodian-visi-misi

Currency

icon-aud icon-cad icon-chf icon-cnh icon-dkk icon-eur icon-gbp icon-hkd icon-jpy icon-myr icon-nzd icon-sar icon-sek icon-sgd icon-thb icon-usd

Social Icons

icon-social-facebook icon-social-instagram icon-social-kaskus icon-social-linkedin icon-social-slideshare icon-social-twitter icon-social-whatsapp icon-social-youtube icon-social-github icon-social-google

Currency Icons

icon-currency-sar icon-currency-myr icon-currency-usd icon-currency-aud icon-currency-dkk icon-currency-eur icon-currency-gbp icon-currency-idr icon-currency-jpy icon-currency-sek icon-currency-thb icon-currency-cad icon-currency-chf icon-currency-hkd icon-currency-cnh icon-currency-sgd icon-currency-nzd

Additional Icons

icon-hyperlink icon-wallet icon-flazz icon-sakuku icon-list icon-list icon-financial-chart icon-debitcard icon-piechart icon-ellipsis icon-calendar-weekend icon-tableview icon-rewind icon-mastercard icon-creditcard icon-receipt icon-send icon-calculator icon-atm-cash icon-product-debitcard icon-arrow-up icon-arrow-down icon-wallet1 icon-alert1 icon-emoticon icon-kantor-cabang icon-atm icon-weekend-banking icon-kantor-cabang-2 icon-my-bca icon-biayadanlimit icon-syaratdanketentuan icon-moneygram icon-filled-wallet icon-worker-remittance icon-rocket

Icon Bank 4

Permohonan EDC BCA bagi Merchant Baru

Nama Usaha atau Toko

Alamat Usaha

Kota Domisili Usaha

Telepon

Nama Pemilik Usaha

No KTP Pemilik Usaha

Email Pemilik Usaha

Handphone Pemilik Usaha

Dengan ini saya menyatakan BENAR bahwa saya BELUM PERNAH memiliki EDC BCA

Maksimal dalam 5 ( lima ) hari kerja, tim BCA akan menghubungi Anda untuk konfirmasi data dan tanda tangani Formulir Data Merchant

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. In this section, you can find information on the following topics:

Text Input

input-text

input-dropdown

Merek Kendaraan

input-text-error

*Text error

Pendapatan rumah tangga per bulan

Rp 5 jutaRp 500 juta

Checkboxes

Disable

Buttons play a crucial role in guiding our users towards conversion as well as for navigation purposes across the site. The shape and colours of buttons described here allows for a high level of visibility amongst other elements of bca.co.id. As for its label, button labels express the action that will take place upon clicking the button. In this section, you can find information on the following topics:

Primary

Button-primary-active

Active

Button-primary-inactive

Inactive

Secondary

Button-secondary-active

Active

Button-secondary-inactive

Inactive

Text

Textbutton-active

Active

Textbutton-inactive

Inactive

Next Button

next-button-active

Selanjutnya

next-button-inactive

Selanjutnya

Social Media

Facebook

Twetter

Button-search-active

Switch

Switch—view-left

ID EN

Illustrations stand for representing and strengthening the message we want to deliver to the users.In this section, you can find information on the following topics

Visual Icon

Visual icons communicate actions and information with a personality and visual styles that are characteristically BCA.

icon-ajukan-tambahan-pinjaman

icon-chatting

icon-login-to-klikbca

icon-no-result

icon-pelunasan-kredit

icon-simulasi

icon-success

icon-suku-bunga-pasti

icon-promo

Shadows allow UI elements to subtly stand out without compromising their modern look and feel.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Our imagery serves as both an aesthetic and a supporting element to the intended message. Through imagery, we seek to foster an emotional connection and encourage a stronger engagement. In this section, you can find information on the following topics:

Ratio

There are 3 ratios of images used acrossed bca.co.id. These ratios allow images used on bca.co.id to be used across many devices and digital channels, i.e. Facebook, Instagram, and LinkedIn, without further cropping or adjustments. Please be mindful to not place your main subject where it might get cropped when these ratios are applied.

1:1

16:9

4:3

Photography Subject

Human

When using a photograph depicting human subjects, do refrain from including their faces. Excluding the face acts like a blank canvas where the diverse group of BCA’s customers can paint themselves into the scene. This allows users to engage with the imagery at a more personal level.

Objects

Mood and Atmosphere

Our imagery is authentic, relatable, and optimistic. Authentic and relatable imagery allows the user to see how the message fits within natural daily settings.