Inkscape has a bunch of features. This text feature is very simple. All you have to do is to adjust character in text, whether it is spacing, or kerning, or rotation. No need any particular skill, but you have to do it manually. The limit is your imagination. My goal is just giving a free template, not necessarily a complete tutorial here. For more detail, you can read this first.
If you don’t know what inkscape is, just download it from here
You may consider to skip all this useless tutorial, and go straight to download the SVG. I don’t mind at all.
Text shift and Rotation
A simple sample.
First Step
-
Create a new inkscape document, with 200px width and 200px height.
-
Create a box, with no background cover all page area, we need this to align the text.
-
Create a text ‘abc’ inside previous box area, Font size about 80px.
-
Align the text, centered vertically and centered horizontally, using previous box as guidance
Double Click the ‘abc’ text above, you should see a toolbar.
Second Step
Double Click the ‘abc’ text. And highlight the ‘b’ character. And modify the text using the toolbar:
-
Vertical shift: 3px
-
Character Rotation: 5 degrees
You should see the result immediately.
Third Step
Double Click the ‘abc’ text. And highlight the ‘c’ character. And modify the text using the toolbar:
-
Vertical shift: 6px
-
Character Rotation: 10 degrees
You should see the final result.
Save if you think necessary. Or you can download SVG source below.
SVG Source
Sample 1: UU Kemaritiman ?
This is my old real life e-Flyer in 2014. Too simple to be documented.
DeviantArt
Sample 2: Penegakan Hukum
This one is rather a concept than being useful. I mean despite of above sample, you can change the text, the color, of course the message. Just remember, to match the text and the document size, you must consider the character count. The trick to resize is to change the font size. That simple.
Please Click for higher resolution.
Document Properties
Size: 500px width, 600px height
Typography
All use free fonts.
-
Capture It <http://www.dafont.com/capture-it.font: Text Shape>
-
Sablon Up http://www.dafont.com/sablon-up.font
Filter Effect
- Drop Down Shadow: Color: black (#000000), Opacity: 0.5, Blur: 10px, Offset-X: 20, Offset-Y: 20
Color
I was using Google Material Design Pallete to get the red color. But then, I decided to make it maroon by modify the Red part of the RGB to half of the original.
There is also a greyish radial gradient, from center (#ffffffff) to outer (#c8c8c8ff). It looks better than white.
DeviantArt
Sample 3: Go Further with Sample 2
I have promise you, the audience of this article not to go without any downloadble svg template. So let’s go further, and add identity. So you can use this template for your current local campus event, or as an identity card in an exhibition, or whatever you like.
Let’s put each stuff in its own layer so you can change the color and pattern easily. And put a watermarked text as a document ID to make it looks professional. You can turn off this document id later, in finalized version. I mean when your team pretty sure about your design.
Design
This inkscape document inherit all properties from previous sample.
Filter Effect
I want my small identity text, looks like it below the main text. The blur and offset number, should be fewer than main text
- Drop Down Shadow: Color: black (#000000), Opacity: 0.5, Blur: 3px, Offs.et-X: 5, Offset-Y: 5
DeviantArt
SVG Source
If you click this SVG on browser and the font looks weird, you must download and put the right font to your system.
That’s all for now.