Lowland
An editorial magazine template.
Lowland is a magazine and blog site in the Editorial style: a serif nameplate, a cover story set like a printed spread, an asymmetric story grid, a pull quote, a two-column editor's letter with a drop cap, a full-bleed photo story and a numbered contents page. The sample magazine, The Lowland Review, is invented: every story, writer and price is sample content. Photos are Pixabay demo images.
- For
- Magazine / blog
- Built with
- HTML, CSS, ES modules, Motion 14.6.0, anime.js 4.5.0 (no build step)
- Pages
- 3 designed pages
- Themes
- Light and dark, following the system, with a switch
Draft listing: this template is finished but still in review before it goes on sale.
Screens from the template
Every page is laid out for a 390 pixel phone as well as for tablet and desktop.
More pages
The 3D moment
The pull quote reads along with you: each word inks in from proof grey as the line passes the middle of the screen; the nameplate is set letter by letter on load.
What you get
Straight from the template's README, the same file you will find in the repository.
- Front page (
index.html): utility strip, nameplate, section bar and a ticker of this issue's stories; cover story; latest three; pull quote; editor's letter; photo story; "In this issue" contents; subscribe band with a working form state; footer. - Article (
article.html): long-form reading page with a reading progress line, standfirst, hero photo with caption, sticky "about this story" note, drop cap, sub-heads, an inset pull quote, a figure, and a next-story link. - 404 (
404.html). - Light and dark themes (dark is a reading-lamp brown-black), phone to desktop.
- Signature motion: the pull quote reads along with you, each word inking in from proof grey as it passes the middle of the screen. The nameplate is set letter by letter on first load and the cover photo settles; the photo story drifts slightly slower than the page; the article shows a reading progress line.
- Reduced motion: no travel, the quote fully inked, the ticker still.
Pages and stack
Every page below is designed and built, in both themes, at phone, tablet and desktop sizes.
Pages
- Front page
- Article
- 404
Stack
- HTML
- CSS
- ES modules
- Motion 14.6.0
- anime.js 4.5.0 (no build step)
The licence, in short
One purchase covers every site you build. Read the whole licence
You can
- Build as many websites and web apps with it as you like, for yourself or for clients.
- Change anything: code, design, copy, colours and layout.
- Charge clients for the work and hand them the finished site with its source code.
You cannot
- Sell, give away or publish the template itself, changed or not, as a template, theme, starter, kit or design file.
- Use it in a product whose main purpose is letting others build sites, like a site builder or theme marketplace.