Visualize complex recursive plant growth and geometric fractal patterns with this free online L-System generator. Customize rules, depth, and angles easily.
AI Generation Prompt
L-System Fractal Plant Growth Canvas Simulator
This application is a professional-grade, browser-based sandbox for exploring Lindenmayer systems. It allows users to design, visualize, and export recursive geometry and botanical growth patterns using a high-performance HTML5 Canvas rendering engine.
Core Feature List
- Real-Time Rendering Engine: Efficiently translates recursive grammar into vector paths using an optimized Canvas-based drawing loop.
- Preset Library: One-click access to famous fractal configurations (Pythagoras Tree, Koch Snowflake, etc.).
- Live Variable Editing:
- Axiom Editor: Input the starting string for the L-System.
- Rule Definition: Dynamic key-value inputs to add/remove production rules.
- Angle Control: A slider to set the turn angle (in degrees) for the turtle graphics interpreter.
- Iteration Depth: A granular slider to manage recursive depth (1 to 10).
- Visual Customization: Adjust line weight, stroke color, and canvas background transparency for export aesthetics.
- Canvas Interaction: Smooth drag-to-pan and scroll-to-zoom functionality.
- Export Suite: Capability to save the current canvas view as a PNG image or an SVG file.
UI/UX Layout
- Top Bar: Minimalist navigation including "New Project," "Presets," and "Export" buttons. Displays a simple status indicator.
- Sidebar (Left): A collapsible control panel housing all mathematical inputs (Axiom, Rules, Angles). It uses clean, input-heavy UI components with clear labeling.
- Main Display (Center): The primary drawing surface. It occupies 100% of the remaining screen space, providing an immersive, uncluttered view of the fractal.
- Responsive Design: The UI automatically collapses to a mobile-friendly layout, stacking controls below the canvas when viewed on smaller screens.
Color Palette & Aesthetic
- Primary Background:
#F9FAFB(Soft, neutral light grey). - Control Panels:
#FFFFFF(Solid white) withshadow-smand subtleborderfor depth. - Accent Colors: A muted blue (
#2563EB) for action buttons and primary UI states. - Text:
#1F2937(Dark grey) for headings,#4B5563for secondary text. - Style: Clean lines, rounded corners (
rounded-xl), and ample white space. All transitions use 0.2s linear easing to ensure a smooth, "SaaS" feel.
Technical Directives
- Single File Architecture: All CSS and JS must be embedded within the single
index.htmlfile. - In-Memory State Only: Do not use
localStorageorcookies. Save data only within current variable state. If a user refreshes the page, the state resets (or warns the user). - No Popups: Use custom modal components built within the HTML for all alerts, settings, and export dialogues.
- Performance: Use
requestAnimationFramefor rendering to ensure the UI remains responsive during complex path calculations. - Security: Ensure all external links use
rel="noopener noreferrer". The application must run in a restricted iframe environment.
Spread the word
Files being used
Frequently Asked Questions
Everything you need to know about using this application.
What is an L-System and how does this tool generate them?
An L-System, or Lindenmayer system, is a formal grammar used to model the growth processes of plants and geometric patterns. This tool interprets a set of string rewrite rules—defined by an axiom and production rules—and translates them into visual paths on a canvas. By iteratively applying these rules, the software constructs complex, self-similar structures that mimic biological phenomena such as branching, leaf placement, and fractal symmetry.
Can I save or export the fractals generated by this application?
Yes, the tool includes a dedicated 'Export' feature located in the settings menu. You can download your generated fractal as a high-resolution SVG or PNG file, making it easy to incorporate your mathematical designs into other design projects or presentations. Since this application does not use server-side storage or cookies, all work must be exported during your active session. We recommend saving frequently to ensure you do not lose your custom configurations.
Are there built-in presets for common fractals?
Absolutely. The application comes pre-loaded with a library of classic L-System configurations, including the Pythagoras Tree, Sierpinski Triangle, Dragon Curve, and several naturalistic plant models. You can load these presets instantly to explore how different variables affect the final render. These presets are fully editable. Once loaded, you can modify the axioms, angle offsets, or iteration depths to create unique variations and experiment with your own mathematical rulesets.
How do I control the complexity of the rendered fractal?
The primary control for complexity is the 'Iteration Depth' slider located in the sidebar. Increasing the depth causes the L-System grammar to expand further, resulting in higher detail and more intricate patterns, while lowering it simplifies the visualization for faster rendering. Be aware that very high iteration depths can result in a massive number of drawing commands. The tool includes an optimization warning if your chosen configuration might cause performance issues in your web browser.
