Amazing Portfolio Website Using Tailwind CSS
Table of Contents
Hello friends, in this new project we have created a great portfolio website for you which is fully responsive and in this you can add your content like programming related projects and share them.
Friends, we have created this portfolio with the help of Tailwind CSS. In this portfolio, we have first created a landing page which you can also call a home page, in the header of which we have added some buttons like contact, login etc. So if someone clicks on these buttons, then he goes to the landing page, so for that we have created a separate file, the complete code of which is given at the end of the post, you can download it from there.
Portfolio Tailwind Code
Document
Services .
Artifical Intelligence
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Internet of Things
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Graphic Designer
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Web Designer
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Machine Learning
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Web Development
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Ullam a quidem magni sint laudantium eius!
Meet Our Team
Meet the team member who have contributed their designs
for this websites.
Resource person of Tailblocks communinty
John Doe
CEO, Tailblocks
Arkay
Executive Producer
Elina Gilbert
HR
Clay Johnson
Manager
Hannah Saw
Marketing Producer
Wednesday Addams
Financer
Portfolio Showcase
Discover our latest projects and success stories
Inform
ation
Registration Start Date
Registration End Date
Exam Last Date
dates
23 Dec 2021
30 May 2022
23 Dec 2021 to 31 May 2022
suppor
t
get in t
ouch
Our Company
NH-70 Chandigarh-Ludhiana Highway,
Mohali, Punjab (INDIA)
General
Helpline
No:+91 987-6543-210
Portfolio Javascript Code
document.addEventListener('DOMContentLoaded', function() {
const filterButtons = document.querySelectorAll('.filter-button');
filterButtons.forEach(button => {
button.addEventListener('click', () => {
const filterValue = button.textContent.toLowerCase();
const portfolioItems = document.querySelectorAll('.portfolio-item');
portfolioItems.forEach(item => {
const itemCategories = item.querySelector('span').textContent.toLowerCase();
if (filterValue === 'all' || itemCategories.includes(filterValue)) {
item.classList.remove('hidden');
} else {
item.classList.add('hidden');
}
});
});
});
});
Responsive Portfolio Website Using Tailwind Live Preview:-
See the Pen Untitled by Developergtm (@developergtm) on CodePen.
Releted Projects:-
1. Fruit Juice Landing Page Using HTML CSS And JavaScript🚀
Click here For Code
2. Youtube Thumbnail Downloder Using HTML
Click here For Code
3. Responsive Music App Using HTML , CSS & Javascript
Click here For Code
4.Music Dashborad Using HTML , CSS & JavaScript
Click here For Code
5. Animated UI Dashboard Using HTML CSS And Javascript
Click here For Code
6. Modern Login page using HTML CSS 💥
Click here For Code