Devnest Violet: Dark SaaS Website Design

Type
Brand and website concept
Brand
Devnest
Year
2022

Devnest Violet is a dark SaaS website design for product teams that sell on atmosphere. It includes six desktop pages with violet gradient heroes, glossy 3D imagery and a SaaS landing page design you can lift into a launch: home, about, services, web development, blog and contact.

Devnest Violet SaaS website showcase: the home page with glowing robotic hands large in front of the about and services pages on a purple gradient.

The brief

A SaaS landing page design for the dark tech look

Some software brands want to feel like the future, not like a brochure. Devnest Violet takes the same six-page structure as its siblings and pushes it into a dark, glossy register: deep purple gradients, glowing imagery and white cards that float above them. It suits products that benefit from drama.

The visual brief was contrast. Every page opens full width in saturated violet, then hands over to light, airy content so the dramatic first screen never makes the rest of the page hard to read.

What we built

How the Devnest Violet SaaS website is built

Each page opens on a full-width violet gradient hero with a bold condensed headline and a glossy 3D image: glowing robotic hands on the home page, a lightbulb-shaped brain on the about page, and illustrations on the service pages. A white stats card overlaps the hero edge, linking the dark opening to the light content below.

Below the hero, rounded white cards, soft shadows and grey ring and ribbon shapes guide the eye from one service to the next. On the home page a winding ribbon links app development, web development, custom development and big data. A solid violet panel holds white service icon tiles, and testimonials and closing calls to action return to the full gradient.

The about page adds a company video panel, mission and vision cards, a CEO message beside a circular portrait and a team row. The blog page features a circuit-board article, editor picks, tags and a FAQ, and the contact page keeps a short form. Violet is the most expressive of the three colourways and leans most on imagery.

Outcome

A dark SaaS launch page you can lift

Devnest Violet gives a SaaS company a finished dark-style marketing site: six page designs, gradient hero patterns, a 3D image direction and light content sections that stay readable. It is ready to take a real product name, screens and copy, and the hero pattern works as a launch landing page on its own.

Six pages with violet gradient heroes

  • Six desktop page designs: Home, About, Services, Web Development, Blog and Contact
  • Violet gradient heroes with glossy 3D imagery on every page
  • An overlapping white stats card at the hero edge
  • A winding ribbon layout linking four service sections
  • Mission and vision cards, a CEO message with circular portrait and a team row
  • Solid violet panel of white service icon tiles
  • Blog with a featured circuit-board article, tags and FAQ accordion

Scroll through Devnest Violet

Six pages, scroll to move through each one.

Home

Full-length Devnest Violet SaaS website home page design with a violet gradient hero, glowing robotic hands, an overlapping stats card and a winding ribbon of services.

About

Full-length Devnest Violet SaaS website about page design with a glowing lightbulb brain hero, company video, mission and vision cards, CEO message and team photos.

Services

Full-length Devnest Violet SaaS website services page design with a violet hero, a rounded panel of white service icon tiles and a testimonial band.

Web Development

Full-length Devnest Violet SaaS website web development page design with a hero illustration, service tabs and industry icons on soft shadowed cards.

Blog

Full-length Devnest Violet SaaS website blog page design with a glowing circuit-board featured article, article lists and a FAQ accordion.

Contact

Full-length Devnest Violet SaaS website contact page design with a violet hero and a short contact form.

Want a site like this?

Tell us what you are building and we will come back with a written scope.
Get a Quote

Questions about Devnest, Violet

  • Devnest Violet includes six desktop page designs: Home, About, Services, Web Development, Blog and Contact. Each opens on a violet gradient hero and carries the same section system, including service tiles, testimonials, a team row, a blog with FAQ and a contact form.
  • Devnest Violet works as a SaaS landing page design for products that want a dramatic first screen. The hero pairs a bold headline with glossy 3D imagery, an overlapping stats card and a clear call to action, and the sections below stay light and readable. The hero and services pattern can run as a standalone launch page.
  • The violet gradients, logo, imagery and page list of Devnest Violet can all change to suit your product and copy, and the layout can be trimmed to fewer pages.
Next projectDevnest, CobaltDevnest

Let's put this in writing.

Tell us what you need. A reply comes within one business day, the written scope with dates follows the call within one business day, and you own every file, login and domain from the day it ships.