Introduction
Welcome to my project showcase. This project aims to enhance accessibility and user experience for all users. The Background Contrast and Font Size Selection page is thoughtfully designed to offer a variety of options, ensuring an inclusive and user-friendly experience.
Contrast Options
Users can choose from different contrast options to enhance readability, including:
- White text on a black background
- Black text on a white background
- Gold text on a black background
- Gold text on a blue background
Font Size Options
Additionally, users can select from small, medium, and large font sizes to suit their personal preferences and visual needs. This ensures the page caters to a wide range of users, making it an inclusive and user-friendly experience.
Screenshots or Preview
Key Features
- Responsive Design
- Accessibility Features
- User-friendly Interface
- Customizable Settings
Code Snippet
// JavaScript function to set contrast
function setContrast(option) {
switch (option) {
case 1:
document.body.style.backgroundColor = 'white';
document.body.style.color = 'black';
break;
case 2:
document.body.style.backgroundColor = 'black';
document.body.style.color = 'white';
break;
case 3:
document.body.style.backgroundColor = 'black';
document.body.style.color = 'gold';
break;
case 4:
document.body.style.backgroundColor = 'blue';
document.body.style.color = 'gold';
break;
}
localStorage.setItem('contrast-selection', option);
}