NS
Nicole Stellatos

Website Header With Search - Copy this React, Tailwind Component to your project

generate a React component using Material UI for a website header. The component should have the following specifications: Logo Image: Place a logo image on the far left side of the header. Search Bar: Position a search bar in the center of the header. The search bar and its icon should be styled in white, and it should have a border with the hex color #B77151. Navigation Link Button and Cart Icon: Navigation Link Button: This should be placed on the far right. The button should have a background color of #B77151, text in white, and a ripple effect when clicked. Cart Icon: Also on the far right, next to the navigation button. The icon should be styled in white. Background Color: The entire header should have a background color of #162d3d.

Prompt
Component Preview

About

WebsiteHeaderWithSearch - Features a logo on the left, a centered search bar with a stylish border, and navigation buttons with a cart. Download instantly!

Share

Last updated 1 month ago