B.I FLIX

B.I ORIGINALS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery1-slider'); const prevButton = document.querySelector('.gallery1-prev-button'); const nextButton = document.querySelector('.gallery1-next-button'); const youtubeItems = document.querySelectorAll('.gallery1-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery1-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery1-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

MUSIC VIDEOS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery2-slider'); const prevButton = document.querySelector('.gallery2-prev-button'); const nextButton = document.querySelector('.gallery2-next-button'); const youtubeItems = document.querySelectorAll('.gallery2-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery2-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery2-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

PERFORMANCE VIDEOS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery3-slider'); const prevButton = document.querySelector('.gallery3-prev-button'); const nextButton = document.querySelector('.gallery3-next-button'); const youtubeItems = document.querySelectorAll('.gallery3-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery3-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery3-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

DANCE PRACTICE VIDEOS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery4-slider'); const prevButton = document.querySelector('.gallery4-prev-button'); const nextButton = document.querySelector('.gallery4-next-button'); const youtubeItems = document.querySelectorAll('.gallery4-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery4-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery4-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

CONCERTS AND FANMEETINGS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery5-slider'); const prevButton = document.querySelector('.gallery5-prev-button'); const nextButton = document.querySelector('.gallery5-next-button'); const youtubeItems = document.querySelectorAll('.gallery5-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery5-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery5-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

DRAMAS AND FILMS

/* main event listener that waits for the page to load before running the script */ document.addEventListener('DOMContentLoaded', () => { /* select the main elements from the HTML */ const slider = document.querySelector('.gallery6-slider'); const prevButton = document.querySelector('.gallery6-prev-button'); const nextButton = document.querySelector('.gallery6-next-button'); const youtubeItems = document.querySelectorAll('.gallery6-youtube-video'); const videoModal = document.getElementById('video-modal'); const videoFrame = document.getElementById('video-frame'); const closeButton = document.querySelector('.close-button'); /* keeps track of the current position in the carousel */ let currentIndex = 0; /* next Button Functionality */ nextButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery6-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex + 1); /* move to the next item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the beginning */ if (currentIndex > maxIndex) {currentIndex = 0;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the next item */ }); /* previous Button Functionality */ prevButton.addEventListener('click', () => { const allItems = document.querySelectorAll('.gallery6-slider > *'); const itemWidth = allItems[0].offsetWidth + parseInt(window.getComputedStyle(allItems[0]).marginRight) * 2; const visibleItemsCount = Math.round(slider.offsetWidth / itemWidth); currentIndex = (currentIndex - 1); /* move to the previous item */ const maxIndex = allItems.length - visibleItemsCount; /* loop back to the end */ if (currentIndex < 0) {currentIndex = maxIndex;} slider.style.transform = `translateX(-${currentIndex * itemWidth}px)`; /* show the previous item */ }); /* youtube video modal */ youtubeItems.forEach(item => { item.addEventListener('click', () => { const videoUrl = item.querySelector('img').getAttribute('data-video-url'); if (videoUrl) { const videoId = videoUrl.split('v=')[1] || videoUrl.split('/').pop(); videoFrame.src = `https://www.youtube.com/embed/${videoId}?autoplay=1`; videoModal.style.display = 'block'; } }); }); closeButton.addEventListener('click', () => { /* closes the modal when close button is clicked */ videoFrame.src = ''; videoModal.style.display = 'none'; }); videoModal.addEventListener('click', (e) => { /* closes the modal when anywhere outside the video is clicked */ if (e.target === videoModal) { videoFrame.src = ''; videoModal.style.display = 'none'; } }); });

profile

Hangul : 비아이Name : Kim Hanbin / 김한빈Label : 131 (2021 June 01 - )Solo Debut : 2021 June 01Fandom : IDFandom Colour :Official Lightstick : BINBONG

Former Labels

YG Entertainment, as member of iKON (2015 - 2019 June 12)

awards / recognitions

Pre-debut

Show Me the Money 3

B.I : “Be I” : first single from SMTM to top the charts
B.I and Bobby broke the idol-rapper stereotype

2014 Mnet Asian Music Awards

B.I and Bobby : first idol trainees to perform at MAMA

2018

10th Melon Music Awards : Songwriter of the Year - top earner in terms of royalties

2019

becomes full member of the Korea Music Copyright Association (KOMCA)

2020

appointed as Executive Director at IOK Company for IOK Music (resigned 11 October 2022)

2021

debut as solo artist under IOK Music affiliate 131 Label
“illa illa” : most viewed kpop male soloist debut MV in the first 24 hours with 12.7M views

2022

first Asian artist to feature in the GRAMMYs Global Spin series
131, formerly 131 Label, becomes an independent label

2023

becomes the cover of the inaugural issue of HIT! Magazine (Brazil)
first and only Korean artist to perform at Lollapalooza Berlin
headlined the first K-pop concert in Estonia in Tallinn on October 03 (it’s kind of a fun fact :)
Supersound Festival : Best Rapper of the Year

2024

Hanteo Music Awards 2023 : Special Award (Hip Hop)

+where to start

Listen to his demos!
Do NOT miss his b-sides and remixes or you're seriously missing out!
Read the English translation of each song at least once.

Here's a list of personal faves by playlist-ish. Here ya go:

DEMOS : Fairytale / Hawaii Love / At That Time

LOVE STREAMING : Midnight Blue / Remember Me / Blossom

LEGENwaitforitDARY : Waterfall / Flame / BTBT / Dare to Love

PARTY PEOPLE : To Die / Beautiful Life / Michelangelo

HANBIN AND CHILL : Re-birth / Middle with You

CRIES IN HEARTBREAK :

OLDIES BUT GOODIES : Numb / Cloud Thought

GUILTY PLEASURE : Got It Like That / Gray / Lover

SHOWER SESSIONS :

ROADTRIP JAMS : illa illa / The Island of Misfit Toys

THIS IS REMIX : Lost at Sea (illa illa 2)

UNDERDOGS : Then

iKON : While in iKON, he was the main songwriter, composer and producer of the group. Check iKON discography for a list of his previous works.

I'll finish this some day~~

albums

waterfall / 2021.06.01 / first full album as a solo artist
to die for / 2023.06.01
wonderland / 2025.06.01

extended plays

cosmos / 2021.11.11
love or loved [l.o.l] pt. 1 / 2022.11.18
love or loved part.2 / 2023.11.10
tadaima / 2024.03.12 / japan

singles

midnight blue [love streaming] / 2021.03.19 / all proceeds from sales, streaming and copyright will be donated to support children in need through World Vision
got it like that / 2021.05.14
lost at sea (illa illa 2) / 2021.10.01
btbt / 2022.05.13
ttm / 2023.04.27
tasty / 2024.05.20

features / credits / others

2009

Indian Boy / MC Mong ft Duble Sidekick and B.I

2014

Be I / B.I / Lyrics and Composition
Born Hater / Epik High ft Beenzino, Verbal Jint, B.I, Mino, Bobby / Lyrics and Composition
Empty / Winner / Lyrics and Composition

2016

Whistle / Blackpink / Lyrics

2017

Last Scene / PSY ft Lee Sungkyoung / Lyrics
Bomb / PSY ft B.I and Bobby / Lyrics and Composition
Auto Reverse / PSY ft Tablo / Lyrics
Shut Up & Smash OST / iKON / Lyrics? and Composition