Easily design intricate Flower of Life sacred geometry patterns online. Use this free, browser-based tool to connect nodes, customize grids, and export your art.
AI Generation Prompt
Application Overview
This application is a specialized browser-based drawing utility built using the Fabric.js library, designed for creating and manipulating "Flower of Life" sacred geometry patterns. It focuses on precision, allowing users to interact with geometric nodes to generate custom patterns, connect points with lines, and export the result.
Technical Constraints
- Architecture: Single-file HTML (HTML5, CSS3, Vanilla JS).
- Framework: Fabric.js (via CDN).
- Storage: STRICTLY FORBIDDEN (No localStorage, cookies, or IndexedDB).
- Aesthetic: High-contrast, clean, light-mode only design (white background, soft grey borders, vibrant accent colors for active nodes).
UI Layout Specification
- Top Header:
- Left: Application Name (Descriptive).
- Right: Action buttons (Clear Canvas, Export PNG, Export SVG, Help).
- Left Sidebar (Control Panel):
- Slider: Circle Density (Adjust number of concentric circles).
- Slider: Stroke Width / Node Radius.
- Toggle: Snapping (Snap lines to geometric nodes).
- Color Picker: Line/Node colors.
- Main Workspace:
- A responsive canvas area that auto-resizes. Fabric.js implementation handles the drawing.
- Grid lines should be subtle, allowing the primary geometry to stand out.
- Status Bar:
- Bottom: Coordinates display (dynamic updates on mouse move).
Core Feature Requirements
- Interactive Node System: Users can click and drag to connect specific points on the geometry, creating unique patterns within the Flower of Life structure.
- Geometric Pattern Generator: Automated generation of the seed of life / flower of life pattern based on user-defined parameters.
- Export Engines: Utilizing the canvas
toDataURLfor PNG andtoSVGfor vector outputs. - Responsiveness: Ensure the Fabric.js canvas scales correctly on window resize without breaking the coordinate system.
Design Language
- Color Palette:
- Background:
#FFFFFF - Panels:
#F9FAFB(Subtle grey) - Borders:
#E5E7EB - Primary Accent (Buttons/Active Nodes):
#2563EB(Bright blue) - Text:
#1F2937(Dark grey for readability)
- Background:
- Animations: Smooth opacity transitions on hover for buttons. Minimalist iconography.
Developer Directives
- Load Fabric.js via CDN in the head tag.
- Initialization: Wrap the canvas instantiation in a function that detects the parent container's dimensions.
- No Popups: Implement a custom
div-based modal for instructions or errors. - CSS: Use modern Flexbox/Grid for layout. Avoid
floator legacy grid hacks.
Spread the word
Files being used
Frequently Asked Questions
Everything you need to know about using this application.
What is the Flower of Life geometry?
The Flower of Life is a geometrical figure composed of multiple evenly-spaced, overlapping circles, arranged in a flower-like pattern with sixfold symmetry. It is widely recognized in sacred geometry for its aesthetic beauty and mathematical precision, often used as a template for mandalas, spiritual art, and complex geometric designs. Our tool simplifies the creation of these intricate patterns by providing an interactive grid. Users can manipulate nodes and connections to build custom variations, allowing you to explore the mathematical relationships between circles and intersections without needing advanced graphic design software.
How do I export my finished geometric design?
This application includes a built-in export functionality that allows you to download your created canvas directly to your device. You can choose to export your design as a high-quality PNG image file or as a Scalable Vector Graphics (SVG) file, which is perfect for printing, laser cutting, or further editing in professional vector software. To export, simply click the 'Export' button located in the main header of the application. The system will process the current state of the Fabric.js canvas and prompt your browser to save the file locally. Since this is a client-side tool, your designs remain entirely private.
Does this tool save my progress if I close the tab?
For security and privacy reasons, this application does not use browser-based storage solutions like localStorage, cookies, or indexedDB. This ensures that your designs are not stored on our server or your browser, maintaining complete privacy. Your work is entirely contained within the memory of your current browser session. Because of this, we recommend that you export your design frequently if you are working on a complex pattern. Once you close the browser window or refresh the page, the application will reset to its default state. Please ensure you have downloaded your work before navigating away.
Can I use this tool for professional or commercial purposes?
Yes, this utility is completely free to use for both personal and professional projects. Whether you are creating artwork for personal inspiration, designing patterns for merchandise, or developing geometric templates for educational purposes, the designs you create with this tool are yours to keep and utilize as you see fit. We provide this tool as a lightweight, browser-based utility to empower artists and designers. There are no watermarks or limitations on the number of designs you can generate, making it a reliable resource for quick prototyping and creative pattern exploration.
