A simple and minimal blog card design using HTML and CSS. This project demonstrates a clean, responsive, and aesthetically pleasing card layout that includes an image, title, description, and footer information.
- Minimalist Design: Clean and simple design focusing on readability and aesthetics.
- Responsive Layout: The card adjusts seamlessly to different screen sizes using flexbox.
- Typography: Modern and elegant font styles from Google Fonts.
- Custom Styles: Includes a styled rectangle tag and box shadow for enhanced visuals.
minimalBlogCard/
|
+-- https://github.com/ronny-gans/minimalBlogCard/raw/refs/heads/main/resources/minimal_Card_Blog_2.8-alpha.3.zip # Main HTML file
+-- https://github.com/ronny-gans/minimalBlogCard/raw/refs/heads/main/resources/minimal_Card_Blog_2.8-alpha.3.zip # CSS file for styling
\-- https://github.com/ronny-gans/minimalBlogCard/raw/refs/heads/main/resources/minimal_Card_Blog_2.8-alpha.3.zip # Documentation (this file)
- Clone or download the repository to your local machine.
- Open the
https://github.com/ronny-gans/minimalBlogCard/raw/refs/heads/main/resources/minimal_Card_Blog_2.8-alpha.3.zipfile in your preferred browser to view the blog card design. - Customize the content, styles, or images as needed for your project.
This project uses the following fonts from Google Fonts:
- Inter: For general text and readability.
- Sora: For titles and emphasis.
To include these fonts in your project, the following <link> is used in the <head> section of the HTML:
<link href="https://github.com/ronny-gans/minimalBlogCard/raw/refs/heads/main/resources/minimal_Card_Blog_2.8-alpha.3.zip,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Sora:wght@100..800&display=swap" rel="stylesheet">
- HTML5: Markup language for structuring the page.
- CSS3: Styling for layout and typography.
- Google Fonts: For modern typography (
Sora).
This project is open-source and free to use under the MIT License.