About .cursorrules prompt file
What you can build
Neo-Organic Fusion Portfolio: A portfolio builder tool using Next.js that applies the Neo-Organic Fusion Design System for creating visually stunning and accessible personal websites for software engineers and entrepreneurs.
Gradient Design Toolkit: A web app that provides a collection of reusable gradient background combinations compliant with the Neo-Organic Fusion Design that users can integrate into their own projects.
3D Component Library: A library of pre-built 3D components using @react-three for Next.js projects, helping developers easily integrate 3D designs with a focus on tactile digital experiences.
Tailwind Micro-Interactions Generator: A web application allowing developers to generate and preview custom Tailwind CSS animations and transitions that fit within the Micro-Interactions guidelines of the Neo-Organic Fusion Design System.
Typography Contrast Assistant: An online tool that helps designers select and preview serif headlines and sans-serif body fonts, ensuring typographic contrast and readability as per the Neo-Organic Fusion guidelines.
Card-Based Interface Builder: A design tool for creating modular card layouts for Next.js applications, enhancing user experience with interactive and responsive content sections.
Whitespace Strategy Planner: A design guide that assists developers in strategically incorporating whitespace into digital designs to emphasize key elements without overburdening the user interface.
Color Emotion and Tone Analyzer: An analytics service that evaluates and suggests color palettes in relation to emotional tone and emphasis for use in Neo-Organic Fusion projects.
Accessibility Design Audit Tool: A service that scans websites for compliance with accessibility standards while maintaining aesthetic appeal based on the Neo-Organic Fusion approach.
Entrepreneur's Digital Toolkit: A suite of customizable business tools and templates styled with Neo-Organic Fusion Design, specifically aimed at assisting entrepreneurs in starting and growing businesses online.
Benefits
- Integrate Neo-Organic Fusion with Tailwind, ensuring minimalist aesthetic and subtle colors.
- Optimize for accessibility with assistive technology-friendly elements and conscious whitespace usage.
- Utilize @react-three for 3D effects, maintaining client-side rendering with "use client" directive.
Synopsis
Developers aiming to create a visually engaging and responsive personal website using Next.js, Tailwind CSS, and a Neo-Organic Fusion Design System would benefit, enhancing user experience through minimalist design and micro-interactions.
Overview of .cursorrules prompt
The .cursorrules file outlines a personal website project built with Next.js and Tailwind CSS. It utilizes the Neo-Organic Fusion Design System, featuring a minimalist layout, gradient backgrounds, card-based interface, and typography contrast. Emphasis is placed on micro-interactions, asymmetrical composition, and conscious whitespace to enhance user experience. The website incorporates an accessibility-first approach and a tactile digital experience. For 3D content, @react-three is used. Instructions stress direct code implementation without placeholder comments, encouraging clear communication and decision-making for feature development.
