Drawmatinc

Play with settings and create the magic

Home Tools Games Articles About Contact

Drawmatinc Art

Brush Stroke Patterns Drawing Tool
Brush
Color
Transformations
Background
Text

Brush

Wooly Chalk Straws Threads Watercolor

Color

0.5

Download the images below
the canvas or upload your own

Symmetry

1 2 4 6 8

Mirror

None Horizontal Vertical

Background

Text

Welcome

Step into a world of creativity where every stroke tells a story. Unleash your imagination with the Brush Stroke Patterns Drawing Tool!

For the best experience
please switch to desktop mode.

 Tutorial for the Brush Stroke Patterns Drawing Tool

Welcome to the Brush Stroke Patterns Drawing Tool, a creative web application designed to help you unleash your artistic potential with unique brush styles, vibrant colors, and interactive features. This tutorial will guide you through the tool’s interface, features, and how to create stunning artwork.
Getting Started
  1. Access the Tool:
    • Open the tool in a modern web browser. The welcome screen will appear with an inspirational quote and a "Start Creating" button.
    • Click "Start Creating" to dismiss the welcome screen and begin.
  2. Interface Overview:
    • Toolbar: Located at the top, containing action buttons (Clear, Save, Undo, Redo) and tabs for settings (Brush, Color, Transformations, Background, Text).
    • Canvas: The main drawing area below the toolbar, where your artwork takes shape.
    • Orientation Overlay: Appears on mobile devices in portrait mode, suggesting a switch to desktop mode for the best experience.
Step-by-Step Guide
1. Adjusting the Canvas
  • Resolution: In the toolbar’s #actions-cell, use the Resolution dropdown to select your preferred canvas size:
    • HD (1280x720)
    • Full HD (1920x1080) – default
    • 4K (3840x2160)
  • The canvas automatically resizes based on your window size and the selected resolution. Resize your browser or change the resolution to see the effect.
2. Choosing a Brush
  • Click the Brush tab to access brush settings.
  • Brush Type: Select from Wooly, Chalk, Straws (default), Threads, or Watercolor using the toggle buttons.
  • Customization:
    • Size: Adjust the slider (10-200) to change brush thickness.
    • Smoothness: Set with a slider (1-100) to control stroke continuity.
    • Opacity: Use the slider (0-1) to adjust transparency.
    • Specific settings (e.g., Density for Wooly, Circle for Straws) appear based on the selected brush.
  • Start drawing by clicking and dragging on the canvas. The center pointer will disappear once you begin.
3. Applying Colors
  • Switch to the Color tab.
  • Primary/Secondary Colors: Use the color pickers to set your main and secondary colors.
  • Dual Tone: Check the "Dual" box to blend colors based on the Ratio slider (0-1).
  • Color Image: Upload an image to sample colors from it, and choose a sampling method (Random, Spatial, Horizontal, Vertical, Radial).
  • Draw to see the color effects applied to your brush strokes.
4. Adding Transformations
  • Open the Transformations tab.
  • Symmetry: Select the number of symmetry axes (1, 2, 4, 6, 8) to create mirrored patterns.
  • Mirror: Choose "Horizontal" or "Vertical" mirroring for additional reflections.
  • Draw to observe how symmetry and mirroring affect your strokes.
5. Setting the Background
  • Go to the Background tab.
  • Color: Pick a background color with the color picker.
  • Image: Upload an image to set as the background.
  • Transparent: Check this box to remove the background for a transparent canvas.
  • The background updates automatically when you change these settings.
6. Adding and Editing Text
  • Switch to the Text tab.
  • Input Text: Type your text in the input box (set to 60% width).
  • Font: Choose from Arial, Times, or Courier using the dropdown.
  • Size: Adjust the slider (10-100) for text size.
  • Color: Select a text color with the color picker.
  • Place Text:
    • Click on the canvas to set the position.
    • Press Enter or click the Add Text button to place the text at the clicked location.
  • Drag Text: In text mode, click and drag existing text to reposition it.
7. Managing Your Artwork
  • Clear: Click Clear to reset the canvas and start over.
  • Save: Click Save to download your artwork as a PNG file.
  • Undo/Redo: Use Undo or Redo to step back or forward through your actions. Undo All and Redo All animate the process.
  • Save Video: Click Save Video to record your drawing history as a WebM file (captures all actions).
Tips and Tricks
  • Experiment with Brushes: Try different brush types and settings to create unique patterns.
  • Use Symmetry: Higher symmetry settings (e.g., 8) combined with mirroring can produce intricate designs.
  • Color Sampling: Upload a colorful image for the color picker to generate dynamic stroke colors.
  • Mobile Use: Switch to landscape mode or use a desktop for optimal performance, as indicated by the orientation overlay.
Troubleshooting
  • Button Spacing: If the "Add Text" button appears too far from the input box, ensure the CSS and JavaScript append it to .text-input-container (see previous fixes).
  • Canvas Not Resizing: Check your browser window size or resolution settings.
  • Video Save Fails: Ensure your browser supports MediaRecorder (e.g., Chrome, Firefox) and has permission to access the canvas.
Advanced Features
  • Pressure Sensitivity: On supported devices (e.g., with a stylus), brush size adjusts based on pressure.
  • Undo/Redo History: The tool tracks all actions for detailed history playback.
  • Custom Backgrounds: Use high-resolution images for a professional touch.
Conclusion
The Brush Stroke Patterns Drawing Tool is a versatile platform for digital artists of all levels. Whether you're creating abstract patterns or adding text to your designs, this tool offers a rich set of features to explore. Share your creations by saving them as images or videos, and enjoy the process of bringing your imagination to life!
at

Tutorials

Explore tutorials for this tool below: