Home
Omer fils ELENGA
about page

about page

This tailwind example is contributed by Omer fils ELENGA, on 04-Dec-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example is about me

About us

Author Omer fils ELENGA

135

Fork Fullscreen

<div class="px-40 flex flex-1 justify-center py-5">
          <div class="layout-content-container flex flex-col max-w-[960px] flex-1">
            <div class="flex flex-wrap justify-between gap-3 p-4">
              <p class="text-[#1b160d] tracking-light text-[32px] font-bold leading-tight min-w-72">À propos de Feux de Brazza</p>
            </div>
            <p class="text-[#1b160d] text-base font-normal leading-normal pb-3 pt-1 px-4">
              Créé en 2005, Feux de Brazza est un festival international de musiques traditionnelles, devenu un événement incontournable pour les amateurs de rythmes et de mélodies
              africaines. Sa mission est de préserver, promouvoir et transmettre le riche patrimoine musical africain, tout en favorisant la créativité et le dialogue
              interculturel.
            </p>
            <h2 class="text-[#1b160d] text-[22px] font-bold leading-tight tracking-[-0.015em] px-4 pb-3 pt-5">Nos valeurs</h2>
            <div class="flex items-center gap-4 bg-[#fcfaf8] px-4 min-h-14">
              <div class="text-[#1b160d] flex items-center justify-center rounded-lg bg-[#f3eee7] shrink-0 size-10" data-icon="MusicNote" data-size="24px" data-weight="regular">
                <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                  <path
                    d="M210.3,56.34l-80-24A8,8,0,0,0,120,40V148.26A48,48,0,1,0,136,184V98.75l69.7,20.91A8,8,0,0,0,216,112V64A8,8,0,0,0,210.3,56.34ZM88,216a32,32,0,1,1,32-32A32,32,0,0,1,88,216ZM200,101.25l-64-19.2V50.75L200,70Z"
                  ></path>
                </svg>
              </div>
              <p class="text-[#1b160d] text-base font-normal leading-normal flex-1 truncate">Préservation du patrimoine musical africain</p>
            </div>
            <div class="flex items-center gap-4 bg-[#fcfaf8] px-4 min-h-14">
              <div class="text-[#1b160d] flex items-center justify-center rounded-lg bg-[#f3eee7] shrink-0 size-10" data-icon="Users" data-size="24px" data-weight="regular">
                <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                  <path
                    d="M117.25,157.92a60,60,0,1,0-66.5,0A95.83,95.83,0,0,0,3.53,195.63a8,8,0,1,0,13.4,8.74,80,80,0,0,1,134.14,0,8,8,0,0,0,13.4-8.74A95.83,95.83,0,0,0,117.25,157.92ZM40,108a44,44,0,1,1,44,44A44.05,44.05,0,0,1,40,108Zm210.14,98.7a8,8,0,0,1-11.07-2.33A79.83,79.83,0,0,0,172,168a8,8,0,0,1,0-16,44,44,0,1,0-16.34-84.87,8,8,0,1,1-5.94-14.85,60,60,0,0,1,55.53,105.64,95.83,95.83,0,0,1,47.22,37.71A8,8,0,0,1,250.14,206.7Z"
                  ></path>
                </svg>
              </div>
              <p class="text-[#1b160d] text-base font-normal leading-normal flex-1 truncate">Transmission aux jeunes générations</p>
            </div>
            <div class="flex items-center gap-4 bg-[#fcfaf8] px-4 min-h-14">
              <div class="text-[#1b160d] flex items-center justify-center rounded-lg bg-[#f3eee7] shrink-0 size-10" data-icon="Palette" data-size="24px" data-weight="regular">
                <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                  <path
                    d="M200.77,53.89A103.27,103.27,0,0,0,128,24h-1.07A104,104,0,0,0,24,128c0,43,26.58,79.06,69.36,94.17A32,32,0,0,0,136,192a16,16,0,0,1,16-16h46.21a31.81,31.81,0,0,0,31.2-24.88,104.43,104.43,0,0,0,2.59-24A103.28,103.28,0,0,0,200.77,53.89Zm13,93.71A15.89,15.89,0,0,1,198.21,160H152a32,32,0,0,0-32,32,16,16,0,0,1-21.31,15.07C62.49,194.3,40,164,40,128a88,88,0,0,1,87.09-88h.9a88.35,88.35,0,0,1,88,87.25A88.86,88.86,0,0,1,213.81,147.6ZM140,76a12,12,0,1,1-12-12A12,12,0,0,1,140,76ZM96,100A12,12,0,1,1,84,88,12,12,0,0,1,96,100Zm0,56a12,12,0,1,1-12-12A12,12,0,0,1,96,156Zm88-56a12,12,0,1,1-12-12A12,12,0,0,1,184,100Z"
                  ></path>
                </svg>
              </div>
              <p class="text-[#1b160d] text-base font-normal leading-normal flex-1 truncate">Créativité &amp; expression contemporaine</p>
            </div>
            <div class="flex items-center gap-4 bg-[#fcfaf8] px-4 min-h-14">
              <div class="text-[#1b160d] flex items-center justify-center rounded-lg bg-[#f3eee7] shrink-0 size-10" data-icon="Globe" data-size="24px" data-weight="regular">
                <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                  <path
                    d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24ZM101.63,168h52.74C149,186.34,140,202.87,128,215.89,116,202.87,107,186.34,101.63,168ZM98,152a145.72,145.72,0,0,1,0-48h60a145.72,145.72,0,0,1,0,48ZM40,128a87.61,87.61,0,0,1,3.33-24H81.79a161.79,161.79,0,0,0,0,48H43.33A87.61,87.61,0,0,1,40,128ZM154.37,88H101.63C107,69.66,116,53.13,128,40.11,140,53.13,149,69.66,154.37,88Zm19.84,16h38.46a88.15,88.15,0,0,1,0,48H174.21a161.79,161.79,0,0,0,0-48Zm32.16-16H170.94a142.39,142.39,0,0,0-20.26-45A88.37,88.37,0,0,1,206.37,88ZM105.32,43A142.39,142.39,0,0,0,85.06,88H49.63A88.37,88.37,0,0,1,105.32,43ZM49.63,168H85.06a142.39,142.39,0,0,0,20.26,45A88.37,88.37,0,0,1,49.63,168Zm101.05,45a142.39,142.39,0,0,0,20.26-45h35.43A88.37,88.37,0,0,1,150.68,213Z"
                  ></path>
                </svg>
              </div>
              <p class="text-[#1b160d] text-base font-normal leading-normal flex-1 truncate">Dialogue entre peuples &amp; intégration africaine</p>
            </div>
            <div class="flex items-center gap-4 bg-[#fcfaf8] px-4 min-h-14">
              <div class="text-[#1b160d] flex items-center justify-center rounded-lg bg-[#f3eee7] shrink-0 size-10" data-icon="Handshake" data-size="24px" data-weight="regular">
                <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                  <path
                    d="M119.76,217.94A8,8,0,0,1,112,224a8.13,8.13,0,0,1-2-.24l-32-8a8,8,0,0,1-2.5-1.11l-24-16a8,8,0,1,1,8.88-13.31l22.84,15.23,30.66,7.67A8,8,0,0,1,119.76,217.94Zm132.69-96.46a15.89,15.89,0,0,1-8,9.25l-23.68,11.84-55.08,55.09a8,8,0,0,1-7.6,2.1l-64-16a8.06,8.06,0,0,1-2.71-1.25L35.86,142.87,11.58,130.73a16,16,0,0,1-7.16-21.46L29.27,59.58h0a16,16,0,0,1,21.46-7.16l22.06,11,53-15.14a8,8,0,0,1,4.4,0l53,15.14,22.06-11a16,16,0,0,1,21.46,7.16l24.85,49.69A15.9,15.9,0,0,1,252.45,121.48Zm-46.18,12.94L179.06,80H147.24L104,122c12.66,8.09,32.51,10.32,50.32-7.63a8,8,0,0,1,10.68-.61l34.41,27.57Zm-187.54-18,17.69,8.85L61.27,75.58,43.58,66.73ZM188,152.66l-27.71-22.19c-19.54,16-44.35,18.11-64.91,5a16,16,0,0,1-2.72-24.82.6.6,0,0,1,.08-.08L137.6,67.06,128,64.32,77.58,78.73,50.21,133.46l49.2,35.15,58.14,14.53Zm49.24-36.24L212.42,66.73l-17.69,8.85,24.85,49.69Z"
                  ></path>
                </svg>
              </div>
              <p class="text-[#1b160d] text-base font-normal leading-normal flex-1 truncate">Culture de paix &amp; inclusion</p>
            </div>
          </div>
        </div>
        
      </div>
    </div>

Related Examples

Responsive portfolio with dark mode
responsive and support dark mode .portfolio website

Author:
ABDESLAMI ACHRAF

1 year ago

3.7k
Innovative Rwanda-Canada Transport Services Website
Innovative Rwanda-Canada Transport Services Website

Author:
Code Master(Mfuranziza Dusabe Hamza)

4 months ago

471
Simple web portfolio
The portfolio includes all required sections (Hero, Projects, About, Contact) with professional styling, and I've added some premium touches like social media icons, a sticky navigation, and beautiful gradient effects that make it feel cutting-edge and engaging.

Author:
Rathanak Phan

7 months ago

1k
about video
about kelaplus video

Author:
Omer fils ELENGA

6 months ago

766
Our Services Section – Animated & Responsive
A modern and dynamic “Services” section built with Tailwind CSS and Alpine.js, designed to showcase your company’s main offerings with clean visuals and engaging animations. This component uses smooth fade and slide animations to reveal each service card as it comes into view. Each card highlights a core business area — Web Development, Mobile Apps, and Cloud Solutions — with beautiful hover effects, icons, and descriptive lists. Perfect for SaaS websites, agencies, and startups looking to present their services in a visually appealing, professional, and responsive layout. Key Features Smooth scroll-triggered animations with Alpine.js Responsive grid layout (mobile → desktop ready) Built with Tailwind CSS for fast customization Dark mode support included Interactive hover effects for each service card Ideal for corporate, SaaS, or portfolio websites 💡 Services Included 🌐 Web Development (Responsive, SEO-friendly, Optimized) 📱 Mobile Apps (Cross-platform, iOS & Android) ☁️ Cloud Solutions (AWS, Azure, Auto-scaling, Security)

Author:
wavy kits

3 months ago

596
Abous Us
About us section with statastics and CTA buttons

Author:
Rajesh Maheshwari

10 months ago

1k
ArtoGallery
Explore a curated selection of contemporary and classic artwork, connecting collectors and creators in an inspiring online space.

Author:
ORGIN_DREAMS

7 months ago

1.1k
thyis is my play ground
this playground is responsive

Author:
bonheur dev

7 months ago

595
Social Media
Social Media button vertical dark style

Author:
sina

4 months ago

397
Responsive About Section with Tailwind CSS
Built a sleek and fully responsive About Section for my portfolio using Tailwind CSS! 🚀 Designed for smooth adaptability across all screen sizes with a modern and minimal aesthetic. Perfect for showcasing skills, experience, and a personal touch!

Author:
Abdul Baset Bappy

9 months ago

1.5k
Tailwind Flex Component: Responsive Testimonial Section UI
A clean, modern, and fully responsive Testimonial Section built using Tailwind CSS and Flexbox. Ideal for portfolios, agency websites, SaaS landing pages, or any modern UI project. This reusable component includes user images, job titles, and quotes—perfect for showcasing feedback and adding trust to your UI.

Author:
Muhammad Umair Arshad

7 months ago

910
About Us Component

Author:
KULDEEP

6 months ago

1.3k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components