20 CSS Magazine Layouts - csshint

Latest Collection of hand-picked free Html CSS Magazine Layouts Examples For Web Design.

1. Modular CSS Grid Layout Sections

Author

Brian Haferkamp

Made with

HTML (Pug) / CSS (SASS)

demo and code Get Hosting

2. Magazine Grid Layout Vol. II

Author

ilithya

Made with

HTML (Pug) / CSS (SCSS)

demo and code Get Hosting

3. Magazine Grid Layout

Author

ilithya

Made with

HTML (Pug) / CSS (SCSS)

demo and code Get Hosting

4. Red Onion’s: The Daily Prophet

Author

Ana Liza Pandac

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

5. Full Spread Magazine Layout // CSS Grid Layout

See the Pen <a href='https://codepen.io/brianhaferkamp/pen/NEyGrv'>Full Spread Magazine Layout // CSS Grid Layout</a> by Brian Haferkamp (<a href='https://codepen.io/brianhaferkamp'>@brianhaferkamp</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Brian Haferkamp

Made with

HTML (Pug) / CSS (SASS)

demo and code Get Hosting

6. Responsive Multicol Magazine Layout

See the Pen <a href='https://codepen.io/dudleystorey/pen/rvQmxQ'>Responsive Multicol Magazine Layout</a> by Dudley Storey (<a href='https://codepen.io/dudleystorey'>@dudleystorey</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Dudley Storey

Made with

HTML / CSS (SASS)

demo and code Get Hosting

7. Magazine Layout

See the Pen <a href='https://codepen.io/csb324/pen/WJbyZb'>Magazine Layout</a> by Clara Beyer (<a href='https://codepen.io/csb324'>@csb324</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Clara Beyer

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

8. Grid Experiment No. 4

See the Pen <a href='https://codepen.io/julesforrest/pen/QaBvPe'>Grid Experiment No. 4</a> by Jules Forrest (<a href='https://codepen.io/julesforrest'>@julesforrest</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Jules Forrest

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

9. Grid Experiment No. 3

See the Pen <a href='https://codepen.io/julesforrest/pen/oeVKjg'>Grid Experiment No. 3 </a> by Jules Forrest (<a href='https://codepen.io/julesforrest'>@julesforrest</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Jules Forrest

Made with

HTML / CSS

demo and code Get Hosting

10. magazine css grid

See the Pen <a href='https://codepen.io/andrewrock/pen/BwgvOV'>magazine css grid </a> by Andrew (<a href='https://codepen.io/andrewrock'>@andrewrock</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Andrew

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

11. Magazine Layout

See the Pen <a href='https://codepen.io/raiscake/pen/YNvJao'>Magazine Layout</a> by Raisa Yang (<a href='https://codepen.io/raiscake'>@raiscake</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Raisa Yang

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

12. Magazine Layout 1

See the Pen <a href='https://codepen.io/acnorrisuk/pen/wGPjVa'>Magazine Layout 1</a> by Adam Norris (<a href='https://codepen.io/acnorrisuk'>@acnorrisuk</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Adam Norris

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

13. Magazine Layout – USA Hockey Magazine

See the Pen <a href='https://codepen.io/anastasialanz/pen/MJELeg'>Magazine Layout – USA Hockey Magazine</a> by Anastasia Lanz (<a href='https://codepen.io/anastasialanz'>@anastasialanz</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Anastasia Lanz

Made with

HTML (Slim) / CSS (SCSS)

demo and code Get Hosting

14. Coded an article layout I saw in a magazine

See the Pen <a href='https://codepen.io/dominicgan/pen/XdEzWZ'>Coded an article layout I saw in a magazine</a> by dominic (<a href='https://codepen.io/dominicgan'>@dominicgan</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

dominic

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

15. Article

See the Pen <a href='https://codepen.io/patrickedqvist/pen/MyzebR'>Article</a> by Patrick Edqvist (<a href='https://codepen.io/patrickedqvist'>@patrickedqvist</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Patrick Edqvist

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

16. Food Magazine Template

See the Pen <a href='https://codepen.io/rickzanutta/pen/rORPGJ'>Food Magazine Template</a> by Riccardo Zanutta (<a href='https://codepen.io/rickzanutta'>@rickzanutta</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Riccardo Zanutta

Made with

HTML (Pug) / CSS (Stylus) / JS

demo and code Get Hosting

17. Newspaper Style Design

See the Pen <a href='https://codepen.io/silkine/pen/jldif'>Newspaper Style Design</a> by Silke V (<a href='https://codepen.io/silkine'>@silkine</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Silke V

Made with

HTML / CSS

demo and code Get Hosting

18. Responsive Magazine Layout

See the Pen <a href='https://codepen.io/hbuchel/pen/qOxGzW'>CSS Grid Layout Module – Responsive Magazine Layout</a> by Heather Buchel (<a href='https://codepen.io/hbuchel'>@hbuchel</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Heather Buchel

Made with

HTML / CSS (SCSS)

demo and code Get Hosting

19. Responsive magazine layout

See the Pen <a href='https://codepen.io/xmark/pen/epeopR'>Responsive magazine layout</a> by Mark (<a href='https://codepen.io/xmark'>@xmark</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Mark

Made with

HTML / CSS (Less)

demo and code Get Hosting

20. Magazine layout responsive

See the Pen <a href='https://codepen.io/xmark/pen/wKPOeN'>Magazine layout responsive</a> by Mark (<a href='https://codepen.io/xmark'>@xmark</a>) on <a href='https://codepen.io/'>CodePen</a>.

Author

Mark

Made with

HTML / CSS (Less)

demo and code Get Hosting

1. Modular CSS Grid Layout Sections

Author

Made with

2. Magazine Grid Layout Vol. II

Author

Made with

3. Magazine Grid Layout

Author

Made with

4. Red Onion’s: The Daily Prophet

Author

Made with

5. Full Spread Magazine Layout // CSS Grid Layout

Author

Made with

6. Responsive Multicol Magazine Layout

Author

Made with

7. Magazine Layout

Author

Made with

8. Grid Experiment No. 4

Author

Made with

9. Grid Experiment No. 3

Author

Made with

10. magazine css grid

Author

Made with

11. Magazine Layout

Author

Made with

12. Magazine Layout 1

Author

Made with

13. Magazine Layout – USA Hockey Magazine

Author

Made with

14. Coded an article layout I saw in a magazine

Author

Made with

15. Article

Author

Made with

16. Food Magazine Template

Author

Made with

17. Newspaper Style Design

Author

Made with

18. Responsive Magazine Layout

Author

Made with

19. Responsive magazine layout

Author

Made with

20. Magazine layout responsive

Author

Made with

You may also like