Skip to content

An easy tool to create images that contain Quranic ayah (or ayat) and/or English translation as well.

License

Notifications You must be signed in to change notification settings

Khiro95/Rukn-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

logo

النسخة العربية متوفرة هنا

Rukn App

Rukn is an easy tool that allows creating high-quality images which contain Arabic verse(s) from Quran and/or English translation. It makes blending the texts with a background image (or a solid color background) a matter of few clicks! The texts can be styled to have custom color and size to fit the desired design and they can be positioned exactly where needed.

Web App

Rukn app is also available as a web app and the source is available here.

Run

Requires .NET Desktop Runtime 5.x.

How to use

Step 1: Background

  • If you want to use an image, click on Load Image button in the left panel and select it. This will set board size automatically.
  • If you wish to use solid color background, choose the desired color from the color-picker in the left panel then set the desired width and height.

Step 2: Verse(s)

  • From the header panel, select the desired chapter (Surah) then select the desired verse (ayah) number.
  • If you want a range of verses, click on the checkbox near the field To then select the verse number at which the range stop.

Step 3: Text(s)

  • From the right panel, toggle the visibility of the texts by clicking on the corresponding element.

    (Note: elements of reference texts are not clickable)

Step 4: Style

  • In the center area, click on a text to select it, then use the left panel to apply necessary styles (color, font size, and alignment).
  • Some texts has special styles. For example the Arabic text support decorated parentheses. These special styles can be found in the left panel.

Step 5: Position and size

  • Use the mouse/touch to drag the selected text in center area. You can also use keyboard arrows keys to move the selected text, hold the Shift key down to move faster.

  • Use the handles of the selection box to resize the text container. Double-click on the selection box to make the container fit the exact width of the text.

    (Note: Double-clicking on the selection box will only remove any additional horizontal space)

Step 6: Save

  • Once you are done, click on Save button at the bottom panel to save the result as a PNG image.
  • You can click on Copy to copy the result, as a PNG image, to the clipboard.

Samples

The following images are examples of work done using the app:

Sample1 Sample2 Sample3 Sample4

Notes

  • Actually, the only supported narration is Hafs on the authority of Asim.
  • The app uses Saheeh International for English translation.

Credit

About

An easy tool to create images that contain Quranic ayah (or ayat) and/or English translation as well.

Topics

Resources

License

Stars

Watchers

Forks

Languages