DEV Community

Takane Ichinose
Takane Ichinose

Posted on

1

CodePenChallenge Magazine Layout

CodePenChallenge Magazine Layout

Description

This is my sample layout for a design of a magazine.

Dominantly, I used purple colour, just because when I'm browsing a magazine for a reference, the first colour I have seen is purple. Although, I really love this colour.

For header, I used yellow. This is not the direct complementary colour of purple, but supplementary colour of green (which is the complementary colour of purple).

I used green colours for some "highlight" part of the article, to make it "pop-up", and easily readable by the readers.

The font colour is white, because the background colour is a dark color. Also, again the first reference that I saw goes like this.

I don't own too many magazines at home, but I used these magazines to reference my work.

I didn't want to touch the HTML code, so using of images is very limited.

Resources

There are the magazines I used to get reference:

Animage

Nintendo Dream Web

I am not affiliated with those references.

Fonts

Press Start 2P

Fredoka One

Comfortaa

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

Top comments (0)

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

Best practices for optimal infrastructure performance with Magento

Running a Magento store? Struggling with performance bottlenecks? Join us and get actionable insights and real-world strategies to keep your store fast and reliable.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️