Skip to content

yeminimal/Toonstack

Repository files navigation

Toonstack

Toonstack is a creative and responsive web platform designed to showcase the magic of motion and storytelling through animated design. Built to support a seamless user experience across desktop and mobile, Toonstack blends bold typography, dynamic layouts, and modern web practices to deliver a fun, expressive, and polished visual identity.


🌟 Overview

Toonstack is a brand-driven website built to highlight:

  • The brand’s core offerings (“What We Do”)
  • Testimonials from happy users
  • A "How It Works" section for onboarding clarity
  • App store promotion integration
  • Newsletter sign-up
  • A clean, brand-aligned footer

The site leverages a pixel-perfect approach based on carefully designed Figma layouts for both desktop and mobile.


🎨 Design System

Toonstack uses a consistent design system based on the following:

Typography

  • Lapsus Pro – Decorative font used in hero headers.
  • ResotYG – Used for section titles and headline elements.
  • Poppins – Clean sans-serif used for all paragraph and supporting text.

Color Palette

  • Exact HEX color codes and gradients as defined in the original design file.
  • Gradients are used purposefully and replicated to match original styling angles and stops.

🖥️ Page Sections

Each page is structured to reflect the design reference with high fidelity. Key sections include:

Home Page

  • Hero Header
  • What We Do
  • How It Works
  • Testimonials
  • App Store CTA
  • Newsletter Signup
  • Footer

Mobile & Desktop Views

Responsive design is a priority. The layout adapts seamlessly using global responsiveness standards to match both desktop and mobile designs precisely.


🚀 Tech Stack

  • Next.js
  • Typescript
  • Tailwind CSS
  • Responsive Design (Mobile-first approach)

✅ QA & Testing Notes

Toonstack is being developed and refined in phases. The current focus is on:

Matching the live implementation with attached design references (desktop & mobile).

Improving layout consistency and visual fidelity.

Ensuring interactive elements are functional and accessible.

If contributing, please use the design reference images as your pixel benchmark and maintain code/component modularity.


📬 Contact

For feedback, contributions, or questions:

Project Lead: Williams Martins Email: yeminimal@duck.com Twitter: https://x.com/yeminimal Portfolio: https://yeminimal.site

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages