change home page desgin for blog and documentation platorm

Improved prompt:

"Design a new homepage layout for our website, keeping the following elements and requirements:

1. Header Bar: Incorporate a responsive header design that includes:

   • Logo on the left (size: 120x60 pixels)
   • Navigation menu on the right with these links: Home, Blog, Docs, About, Contact
   • Ensure it is clean, professional, and fits well on both desktop and mobile screens

2. Tag Section: Create a section below the header to display popular tags. Include:

   • Maximum of 12 tags
   • Consistent typography and style
   • Clear visual separation from other sections

3. Blog Cards: Design a grid layout for blog posts (4-6 cards per row on desktop). Each card should contain:

   • Featured image (16:9 aspect ratio, 300x180 pixels)
   • Title (maximum 80 characters)
   • Author name and publication date
   • Clear call-to-action button (e.g., "Read More") with consistent styling

4. Docs Cards: Design a separate section for documentation links. Each card should include:

   • Icon or thumbnail that represents the topic
   • Title (maximum 60 characters)
   • Brief description (maximum 100 characters)
   • Link destination

5. Design Constraints:

   • Use our color palette: primary #2196f3, secondary #4caf50, text #333
   • Include sufficient white space for readability
   • Ensure the design is accessible, with sufficient color contrast
   • Make the layout responsive for various screen sizes

6. Deliverables:

   • Provide the design in both desktop and mobile formats (JPEG or PNG)
   • Include a description of any new font or icon usage
   • Offer a mockup that demonstrates the entire homepage layout
   • Share the design in a format that can be easily reviewed and iterated upon

Please create a visually appealing and functional design that aligns with our brand identity and provides a seamless user experience."