diff --git a/Flutter/range-selector/basic-features.md b/Flutter/range-selector/basic-features.md
index c7e38f2d..c4fa286f 100644
--- a/Flutter/range-selector/basic-features.md
+++ b/Flutter/range-selector/basic-features.md
@@ -103,20 +103,20 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2005, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2005), DateTime(2008));
 
 final List<Data> _chartData = <Data>[
-    Data(x: DateTime(2002, 01, 01), y: 2.2),
-    Data(x: DateTime(2003, 01, 01), y: 3.4),
-    Data(x: DateTime(2004, 01, 01), y: 2.8),
-    Data(x: DateTime(2005, 01, 01), y: 1.6),
-    Data(x: DateTime(2006, 01, 01), y: 2.3),
-    Data(x: DateTime(2007, 01, 01), y: 2.5),
-    Data(x: DateTime(2008, 01, 01), y: 2.9),
-    Data(x: DateTime(2009, 01, 01), y: 3.8),
-    Data(x: DateTime(2010, 01, 01), y: 3.7),
+    Data(x: DateTime(2002), y: 2.2),
+    Data(x: DateTime(2003), y: 3.4),
+    Data(x: DateTime(2004), y: 2.8),
+    Data(x: DateTime(2005), y: 1.6),
+    Data(x: DateTime(2006), y: 2.3),
+    Data(x: DateTime(2007), y: 2.5),
+    Data(x: DateTime(2008), y: 2.9),
+    Data(x: DateTime(2009), y: 3.8),
+    Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
@@ -237,14 +237,14 @@ The [`onChanged`](https://pub.dev/documentation/syncfusion_flutter_sliders/lates
 final SfRangeValues _initialValues = SfRangeValues(0.3, 0.7);
 
 final List<Data> _chartData = <Data>[
-  Data(x: DateTime(2003, 01, 01), y: 3.4),
-  Data(x: DateTime(2004, 01, 01), y: 2.8),
-  Data(x: DateTime(2005, 01, 01), y: 1.6),
-  Data(x: DateTime(2006, 01, 01), y: 2.3),
-  Data(x: DateTime(2007, 01, 01), y: 2.5),
-  Data(x: DateTime(2008, 01, 01), y: 2.9),
-  Data(x: DateTime(2009, 01, 01), y: 3.8),
-  Data(x: DateTime(2010, 01, 01), y: 2.0),
+  Data(x: DateTime(2003), y: 3.4),
+  Data(x: DateTime(2004), y: 2.8),
+  Data(x: DateTime(2005), y: 1.6),
+  Data(x: DateTime(2006), y: 2.3),
+  Data(x: DateTime(2007), y: 2.5),
+  Data(x: DateTime(2008), y: 2.9),
+  Data(x: DateTime(2009), y: 3.8),
+  Data(x: DateTime(2010), y: 2.0),
 ];
 
 @override
diff --git a/Flutter/range-selector/getting-started.md b/Flutter/range-selector/getting-started.md
index be29a14e..b7675437 100644
--- a/Flutter/range-selector/getting-started.md
+++ b/Flutter/range-selector/getting-started.md
@@ -66,14 +66,14 @@ I> You need to set the [`controller`](https://pub.dev/documentation/syncfusion_f
 final SfRangeValues _initialValues = SfRangeValues(0.3, 0.7);
 
 final List<Data> _chartData = <Data>[
-  Data(x: DateTime(2003, 01, 01), y: 3.4),
-  Data(x: DateTime(2004, 01, 01), y: 2.8),
-  Data(x: DateTime(2005, 01, 01), y: 1.6),
-  Data(x: DateTime(2006, 01, 01), y: 2.3),
-  Data(x: DateTime(2007, 01, 01), y: 2.5),
-  Data(x: DateTime(2008, 01, 01), y: 2.9),
-  Data(x: DateTime(2009, 01, 01), y: 3.8),
-  Data(x: DateTime(2010, 01, 01), y: 2.0),
+  Data(x: DateTime(2003), y: 3.4),
+  Data(x: DateTime(2004), y: 2.8),
+  Data(x: DateTime(2005), y: 1.6),
+  Data(x: DateTime(2006), y: 2.3),
+  Data(x: DateTime(2007), y: 2.5),
+  Data(x: DateTime(2008), y: 2.9),
+  Data(x: DateTime(2009), y: 3.8),
+  Data(x: DateTime(2010), y: 2.0),
 ];
 
 @override
@@ -125,14 +125,14 @@ I> You need to set the [`controller`](https://pub.dev/documentation/syncfusion_f
 final SfRangeValues _initialValues = SfRangeValues(0.3, 0.7);
 
 final List<Data> _chartData = <Data>[
-  Data(x: DateTime(2003, 01, 01), y: 3.4),
-  Data(x: DateTime(2004, 01, 01), y: 2.8),
-  Data(x: DateTime(2005, 01, 01), y: 1.6),
-  Data(x: DateTime(2006, 01, 01), y: 2.3),
-  Data(x: DateTime(2007, 01, 01), y: 2.5),
-  Data(x: DateTime(2008, 01, 01), y: 2.9),
-  Data(x: DateTime(2009, 01, 01), y: 3.8),
-  Data(x: DateTime(2010, 01, 01), y: 2.0),
+  Data(x: DateTime(2003), y: 3.4),
+  Data(x: DateTime(2004), y: 2.8),
+  Data(x: DateTime(2005), y: 1.6),
+  Data(x: DateTime(2006), y: 2.3),
+  Data(x: DateTime(2007), y: 2.5),
+  Data(x: DateTime(2008), y: 2.9),
+  Data(x: DateTime(2009), y: 3.8),
+  Data(x: DateTime(2010), y: 2.0),
 ];
 
 @override
@@ -249,20 +249,20 @@ I> You need to set the [`controller`](https://pub.dev/documentation/syncfusion_f
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2008));
 
 final List<Data> _chartData = <Data>[
-    Data(x: DateTime(2002, 01, 01), y: 2.2),
-    Data(x: DateTime(2003, 01, 01), y: 3.4),
-    Data(x: DateTime(2004, 01, 01), y: 2.8),
-    Data(x: DateTime(2005, 01, 01), y: 1.6),
-    Data(x: DateTime(2006, 01, 01), y: 2.3),
-    Data(x: DateTime(2007, 01, 01), y: 2.5),
-    Data(x: DateTime(2008, 01, 01), y: 2.9),
-    Data(x: DateTime(2009, 01, 01), y: 3.8),
-    Data(x: DateTime(2010, 01, 01), y: 3.7),
+    Data(x: DateTime(2002), y: 2.2),
+    Data(x: DateTime(2003), y: 3.4),
+    Data(x: DateTime(2004), y: 2.8),
+    Data(x: DateTime(2005), y: 1.6),
+    Data(x: DateTime(2006), y: 2.3),
+    Data(x: DateTime(2007), y: 2.5),
+    Data(x: DateTime(2008), y: 2.9),
+    Data(x: DateTime(2009), y: 3.8),
+    Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
diff --git a/Flutter/range-selector/images/label-and-divider/selector-edge-label-placement.png b/Flutter/range-selector/images/label-and-divider/selector-edge-label-placement.png
new file mode 100644
index 00000000..0c13bd79
Binary files /dev/null and b/Flutter/range-selector/images/label-and-divider/selector-edge-label-placement.png differ
diff --git a/Flutter/range-selector/interval.md b/Flutter/range-selector/interval.md
index 73588c69..981bab37 100644
--- a/Flutter/range-selector/interval.md
+++ b/Flutter/range-selector/interval.md
@@ -93,25 +93,25 @@ The type of date interval can range from years to seconds. It is mandatory for d
 
 For date values, the range selector does not have auto interval support. So, it is mandatory to set [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/interval.html), [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateIntervalType.html), and [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateFormat.html) for date values.
 
-For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/min.html) is `DateTime(2002, 01, 01)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/max.html) is `DateTime(2010, 01, 01)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/interval.html) is `2`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateFormat.html) is `DateFormat.y()` then the range selector will render the labels, major ticks, and dividers at 2002, 2004, 2006 and so on.
+For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/min.html) is `DateTime(2002)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/max.html) is `DateTime(2010)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/interval.html) is `2`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/dateFormat.html) is `DateFormat.y()` then the range selector will render the labels, major ticks, and dividers at 2002, 2004, 2006 and so on.
 
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2008));
 
 final List<Data> chartData = <Data>[
-    Data(x: DateTime(2002, 01, 01), y: 2.2),
-    Data(x: DateTime(2003, 01, 01), y: 3.4),
-    Data(x: DateTime(2004, 01, 01), y: 2.8),
-    Data(x: DateTime(2005, 01, 01), y: 1.6),
-    Data(x: DateTime(2006, 01, 01), y: 2.3),
-    Data(x: DateTime(2007, 01, 01), y: 2.5),
-    Data(x: DateTime(2008, 01, 01), y: 2.9),
-    Data(x: DateTime(2009, 01, 01), y: 3.8),
-    Data(x: DateTime(2010, 01, 01), y: 3.7),
+    Data(x: DateTime(2002), y: 2.2),
+    Data(x: DateTime(2003), y: 3.4),
+    Data(x: DateTime(2004), y: 2.8),
+    Data(x: DateTime(2005), y: 1.6),
+    Data(x: DateTime(2006), y: 2.3),
+    Data(x: DateTime(2007), y: 2.5),
+    Data(x: DateTime(2008), y: 2.9),
+    Data(x: DateTime(2009), y: 3.8),
+    Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
@@ -240,25 +240,25 @@ class Data {
 
 You can move the thumb in discrete manner for date values based on the value provided in the [`stepDuration`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/stepDuration.html) property in the range selector.
 
-For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/min.html) is DateTime(2015, 01, 01) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/max.html) is DateTime(2020, 01, 01) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/stepDuration.html) is SliderDuration(years: 1, months: 6),the range selector will move the thumbs at DateTime(2015, 01, 01), DateTime(2016, 07, 01), DateTime(2018, 01, 01),and DateTime(2019, 07, 01).
+For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/min.html) is DateTime(2015) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/max.html) is DateTime(2020) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/stepDuration.html) is SliderDuration(years: 1, months: 6),the range selector will move the thumbs at DateTime(2015), DateTime(2016, 07), DateTime(2018),and DateTime(2019, 07).
 
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2008));
 
 final List<Data> chartData = <Data>[
-  Data(x: DateTime(2002, 01, 01), y: 2.2),
-  Data(x: DateTime(2003, 01, 01), y: 3.4),
-  Data(x: DateTime(2004, 01, 01), y: 2.8),
-  Data(x: DateTime(2005, 01, 01), y: 1.6),
-  Data(x: DateTime(2006, 01, 01), y: 2.3),
-  Data(x: DateTime(2007, 01, 01), y: 2.5),
-  Data(x: DateTime(2008, 01, 01), y: 2.9),
-  Data(x: DateTime(2009, 01, 01), y: 3.8),
-  Data(x: DateTime(2010, 01, 01), y: 3.7),
+  Data(x: DateTime(2002), y: 2.2),
+  Data(x: DateTime(2003), y: 3.4),
+  Data(x: DateTime(2004), y: 2.8),
+  Data(x: DateTime(2005), y: 1.6),
+  Data(x: DateTime(2006), y: 2.3),
+  Data(x: DateTime(2007), y: 2.5),
+  Data(x: DateTime(2008), y: 2.9),
+  Data(x: DateTime(2009), y: 3.8),
+  Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
@@ -319,20 +319,20 @@ You can select a particular interval by tapping when setting the [`enableInterva
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2008));
 
 final List<Data> chartData = <Data>[
-  Data(x: DateTime(2002, 01, 01), y: 2.2),
-  Data(x: DateTime(2003, 01, 01), y: 3.4),
-  Data(x: DateTime(2004, 01, 01), y: 2.8),
-  Data(x: DateTime(2005, 01, 01), y: 1.6),
-  Data(x: DateTime(2006, 01, 01), y: 2.3),
-  Data(x: DateTime(2007, 01, 01), y: 2.5),
-  Data(x: DateTime(2008, 01, 01), y: 2.9),
-  Data(x: DateTime(2009, 01, 01), y: 3.8),
-  Data(x: DateTime(2010, 01, 01), y: 3.7),
+  Data(x: DateTime(2002), y: 2.2),
+  Data(x: DateTime(2003), y: 3.4),
+  Data(x: DateTime(2004), y: 2.8),
+  Data(x: DateTime(2005), y: 1.6),
+  Data(x: DateTime(2006), y: 2.3),
+  Data(x: DateTime(2007), y: 2.5),
+  Data(x: DateTime(2008), y: 2.9),
+  Data(x: DateTime(2009), y: 3.8),
+  Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
diff --git a/Flutter/range-selector/labels-and-divider.md b/Flutter/range-selector/labels-and-divider.md
index 5046af6b..85b634b5 100644
--- a/Flutter/range-selector/labels-and-divider.md
+++ b/Flutter/range-selector/labels-and-divider.md
@@ -168,20 +168,20 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2000, 01, 01);
-final DateTime _max = DateTime(2008, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2006, 01, 01));
+final DateTime _min = DateTime(2000);
+final DateTime _max = DateTime(2008);
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2006));
 
 final List<Data> _chartData = <Data>[
-    Data(x: DateTime(2000, 01, 01), y: 2.2),
-    Data(x: DateTime(2001, 01, 01), y: 3.4),
-    Data(x: DateTime(2002, 01, 01), y: 2.8),
-    Data(x: DateTime(2003, 01, 01), y: 1.6),
-    Data(x: DateTime(2004, 01, 01), y: 2.3),
-    Data(x: DateTime(2005, 01, 01), y: 2.5),
-    Data(x: DateTime(2006, 01, 01), y: 2.9),
-    Data(x: DateTime(2007, 01, 01), y: 3.8),
-    Data(x: DateTime(2008, 01, 01), y: 3.7),
+    Data(x: DateTime(2000), y: 2.2),
+    Data(x: DateTime(2001), y: 3.4),
+    Data(x: DateTime(2002), y: 2.8),
+    Data(x: DateTime(2003), y: 1.6),
+    Data(x: DateTime(2004), y: 2.3),
+    Data(x: DateTime(2005), y: 2.5),
+    Data(x: DateTime(2006), y: 2.9),
+    Data(x: DateTime(2007), y: 3.8),
+    Data(x: DateTime(2008), y: 3.7),
 ];
 
 @override
@@ -239,20 +239,20 @@ class Data {
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2000, 01, 01);
-final DateTime _max = DateTime(2000, 09, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2000, 05, 01), DateTime(2000, 07, 01));
+final DateTime _min = DateTime(2000);
+final DateTime _max = DateTime(2000, 09);
+SfRangeValues _values = SfRangeValues(DateTime(2000, 05), DateTime(2000, 07));
 
 final List<Data> chartData = <Data>[
-    Data(x: DateTime(2000, 01, 01), y: 2.2),
-    Data(x: DateTime(2000, 01, 01), y: 3.4),
-    Data(x: DateTime(2000, 01, 01), y: 2.8),
-    Data(x: DateTime(2000, 01, 01), y: 1.6),
-    Data(x: DateTime(2000, 01, 01), y: 2.3),
-    Data(x: DateTime(2000, 01, 01), y: 2.5),
-    Data(x: DateTime(2000, 01, 01), y: 2.9),
-    Data(x: DateTime(2000, 01, 01), y: 3.8),
-    Data(x: DateTime(2000, 01, 01), y: 3.7),
+    Data(x: DateTime(2000), y: 2.2),
+    Data(x: DateTime(2000), y: 3.4),
+    Data(x: DateTime(2000), y: 2.8),
+    Data(x: DateTime(2000), y: 1.6),
+    Data(x: DateTime(2000), y: 2.3),
+    Data(x: DateTime(2000), y: 2.5),
+    Data(x: DateTime(2000), y: 2.9),
+    Data(x: DateTime(2000), y: 3.8),
+    Data(x: DateTime(2000), y: 3.7),
 ];
 
 @override
@@ -385,20 +385,20 @@ The [`labelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/
 {% tabs %}
 {% highlight Dart %}
 
-final DateTime _min = DateTime(2002, 01, 01);
-final DateTime _max = DateTime(2010, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2005, 01, 01), DateTime(2008, 01, 01));
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2005), DateTime(2008));
 
 final List<Data> chartData = <Data>[
-    Data(x: DateTime(2002, 01, 01), y: 2.2),
-    Data(x: DateTime(2003, 01, 01), y: 3.4),
-    Data(x: DateTime(2004, 01, 01), y: 2.8),
-    Data(x: DateTime(2005, 01, 01), y: 1.6),
-    Data(x: DateTime(2006, 01, 01), y: 2.3),
-    Data(x: DateTime(2007, 01, 01), y: 2.5),
-    Data(x: DateTime(2008, 01, 01), y: 2.9),
-    Data(x: DateTime(2009, 01, 01), y: 3.8),
-    Data(x: DateTime(2010, 01, 01), y: 3.7),
+    Data(x: DateTime(2002), y: 2.2),
+    Data(x: DateTime(2003), y: 3.4),
+    Data(x: DateTime(2004), y: 2.8),
+    Data(x: DateTime(2005), y: 1.6),
+    Data(x: DateTime(2006), y: 2.3),
+    Data(x: DateTime(2007), y: 2.5),
+    Data(x: DateTime(2008), y: 2.9),
+    Data(x: DateTime(2009), y: 3.8),
+    Data(x: DateTime(2010), y: 3.7),
 ];
 
 @override
@@ -452,6 +452,80 @@ class Data {
 
 ![Label placement support](images/label-and-divider/selector_label_placement.png)
 
+## Edge Label placement
+
+The [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/edgeLabelPlacement.html) property is used to place the edge labels either inside the major ticks or on the major ticks. The default value of [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/edgeLabelPlacement.html) property is `EdgeLabelPlacement.auto`.
+
+{% tabs %}
+{% highlight Dart %}
+
+final DateTime _min = DateTime(2002);
+final DateTime _max = DateTime(2010);
+SfRangeValues _values = SfRangeValues(DateTime(2005), DateTime(2008));
+
+final List<Data> chartData = <Data>[
+    Data(x: DateTime(2002), y: 2.2),
+    Data(x: DateTime(2003), y: 3.4),
+    Data(x: DateTime(2004), y: 2.8),
+    Data(x: DateTime(2005), y: 1.6),
+    Data(x: DateTime(2006), y: 2.3),
+    Data(x: DateTime(2007), y: 2.5),
+    Data(x: DateTime(2008), y: 2.9),
+    Data(x: DateTime(2009), y: 3.8),
+    Data(x: DateTime(2010), y: 3.7),
+];
+
+@override
+Widget build(BuildContext context) {
+  return MaterialApp(
+      home: Scaffold(
+          body: Center(
+              child: SfRangeSelector(
+                    min: _min,
+                    max: _max,
+                    showLabels: true,
+                    showTicks: true,
+                    interval: 1,
+                    dateFormat: DateFormat.y(),
+                    edgeLabelPlacement: EdgeLabelPlacement.inside,
+                    dateIntervalType: DateIntervalType.years,
+                    initialValues: _values,
+                    child: Container(
+                    height: 130,
+                    child: SfCartesianChart(
+                        margin: const EdgeInsets.all(0),
+                        primaryXAxis: DateTimeAxis(
+                            minimum: _min,
+                            maximum: _max,
+                            isVisible: false,),
+                        primaryYAxis: NumericAxis(isVisible: false),
+                        plotAreaBorderWidth: 0,
+                        series: <SplineAreaSeries<Data, DateTime>>[
+                            SplineAreaSeries<Data, DateTime>(
+                                color: Color.fromARGB(255, 126, 184, 253),
+                                dataSource: chartData,
+                                xValueMapper: (Data sales, int index) => sales.x,
+                                yValueMapper: (Data sales, int index) => sales.y)
+                            ],
+                        ),
+                   ),
+              ),
+          )
+      )
+  );
+}
+
+class Data {
+  Data({required this.x, required this.y});
+  final DateTime x;
+  final double y;
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+![Edge Label placement support](images/label-and-divider/selector-edge-label-placement.png)
+
 ## Customize label text
 
 You can format or change the whole numeric or date label text using the [`labelFormatterCallback`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSelector/labelFormatterCallback.html). Its arguments are,
diff --git a/Flutter/range-selector/range-controller.md b/Flutter/range-selector/range-controller.md
index a64d79e2..61b7f8d0 100644
--- a/Flutter/range-selector/range-controller.md
+++ b/Flutter/range-selector/range-controller.md
@@ -111,7 +111,7 @@ We have provided built-in support for selecting the chart segments based on the
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2010, 03, 01), DateTime(2010, 06, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2010, 03), DateTime(2010, 06));
 RangeController _rangeController;
 
 @override
@@ -129,15 +129,15 @@ void dispose() {
 }
 
 final List<Data> chartData = <Data>[
-    Data(x: DateTime(2010, 01, 01), y: 2.2),
-    Data(x: DateTime(2010, 02, 01), y: 3.4),
-    Data(x: DateTime(2010, 03, 01), y: 2.8),
-    Data(x: DateTime(2010, 04, 01), y: 1.6),
-    Data(x: DateTime(2010, 05, 01), y: 2.3),
-    Data(x: DateTime(2010, 06, 01), y: 2.5),
-    Data(x: DateTime(2010, 07, 01), y: 2.9),
-    Data(x: DateTime(2010, 08, 01), y: 3.8),
-    Data(x: DateTime(2010, 09, 01), y: 3.7),
+    Data(x: DateTime(2010), y: 2.2),
+    Data(x: DateTime(2010, 02), y: 3.4),
+    Data(x: DateTime(2010, 03), y: 2.8),
+    Data(x: DateTime(2010, 04), y: 1.6),
+    Data(x: DateTime(2010, 05), y: 2.3),
+    Data(x: DateTime(2010, 06), y: 2.5),
+    Data(x: DateTime(2010, 07), y: 2.9),
+    Data(x: DateTime(2010, 08), y: 3.8),
+    Data(x: DateTime(2010, 09), y: 3.7),
 ];
 
 @override
@@ -145,8 +145,8 @@ Widget build(BuildContext context) {
   return Scaffold(
     body: Center(
       child: SfRangeSelector(
-        min: DateTime(2010, 01, 01),
-        max: DateTime(2010, 09, 01),
+        min: DateTime(2010),
+        max: DateTime(2010, 09),
         interval: 2,
         dateIntervalType: DateIntervalType.months,
         dateFormat: DateFormat.yM(),
@@ -161,8 +161,8 @@ Widget build(BuildContext context) {
           child: SfCartesianChart(
             margin: EdgeInsets.zero,
             primaryXAxis: DateTimeAxis(
-              minimum: DateTime(2010, 01, 01),
-              maximum: DateTime(2010, 09, 01),
+              minimum: DateTime(2010),
+              maximum: DateTime(2010, 09),
               isVisible: false,
             ),
             primaryYAxis: const NumericAxis(isVisible: false),
@@ -360,27 +360,27 @@ void initState() {
     data = <Data>[
       Data(x: DateTime(2000, 01, 01, 0), y: 100),
       Data(x: DateTime(2000, 01, 15), y: 10),
-      Data(x: DateTime(2000, 02, 01), y: 40),
+      Data(x: DateTime(2000, 02), y: 40),
       Data(x: DateTime(2000, 02, 15), y: 34),
-      Data(x: DateTime(2000, 03, 01), y: 80),
+      Data(x: DateTime(2000, 03), y: 80),
       Data(x: DateTime(2000, 03, 15), y: 49),
-      Data(x: DateTime(2000, 04, 01), y: 56),
+      Data(x: DateTime(2000, 04), y: 56),
       Data(x: DateTime(2000, 04, 15), y: 26),
-      Data(x: DateTime(2000, 05, 01), y: 8),
+      Data(x: DateTime(2000, 05), y: 8),
       Data(x: DateTime(2000, 05, 15), y: 80),
-      Data(x: DateTime(2000, 06, 01), y: 42),
+      Data(x: DateTime(2000, 06), y: 42),
       Data(x: DateTime(2000, 06, 15), y: 12),
-      Data(x: DateTime(2000, 07, 01), y: 28),
+      Data(x: DateTime(2000, 07), y: 28),
       Data(x: DateTime(2000, 07, 15), y: 68),
-      Data(x: DateTime(2000, 08, 01), y: 94),
+      Data(x: DateTime(2000, 08), y: 94),
       Data(x: DateTime(2000, 08, 15), y: 24),
-      Data(x: DateTime(2000, 09, 01), y: 72),
+      Data(x: DateTime(2000, 09), y: 72),
       Data(x: DateTime(2000, 09, 15), y: 32),
-      Data(x: DateTime(2000, 10, 01), y: 48),
+      Data(x: DateTime(2000, 10), y: 48),
       Data(x: DateTime(2000, 10, 15), y: 4),
-      Data(x: DateTime(2000, 11, 01), y: 64),
+      Data(x: DateTime(2000, 11), y: 64),
       Data(x: DateTime(2000, 11, 15), y: 10),
-      Data(x: DateTime(2000, 12, 01), y: 85),
+      Data(x: DateTime(2000, 12), y: 85),
       Data(x: DateTime(2000, 12, 15), y: 96),
     ];
 
diff --git a/Flutter/range-slider/basic-features.md b/Flutter/range-slider/basic-features.md
index a63bdba8..b0257877 100644
--- a/Flutter/range-slider/basic-features.md
+++ b/Flutter/range-slider/basic-features.md
@@ -107,7 +107,7 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
- SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2004, 01, 01));
+ SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2004));
 
 @override
 Widget build(BuildContext context) {
@@ -115,7 +115,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -143,7 +143,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
- SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2004, 01, 01));
+ SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2004));
 
 @override
 Widget build(BuildContext context) {
@@ -151,7 +151,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -407,7 +407,7 @@ Widget build(BuildContext context) {
                     max: 10.0,
                     values: _values,
                     activeColor: Colors.red,
-                    inactiveColor: Colors.red.withOpacity(0.2),
+                    inactiveColor: Colors.red.withAlpha((255.0 * 0.2).round()),
                     showDividers: true,
                     onChanged: (SfRangeValues newValues) {
                         setState(() {
@@ -442,7 +442,7 @@ Widget build(BuildContext context) {
                     max: 10.0,
                     values: _values,
                     activeColor: Colors.red,
-                    inactiveColor: Colors.red.withOpacity(0.2),
+                    inactiveColor: Colors.red.withAlpha((255.0 * 0.2).round()),
                     showDividers: true,
                     onChanged: (SfRangeValues newValues) {
                         setState(() {
diff --git a/Flutter/range-slider/drag-mode.md b/Flutter/range-slider/drag-mode.md
index b1c8a648..30650111 100644
--- a/Flutter/range-slider/drag-mode.md
+++ b/Flutter/range-slider/drag-mode.md
@@ -16,7 +16,7 @@ When `dragMode` is set to `SliderDragMode.onThumb`, only individual thumb can be
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2014, 01, 01), DateTime(2016, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2014), DateTime(2016));
 
 @override
 Widget build(BuildContext context) {
@@ -25,8 +25,8 @@ Widget build(BuildContext context) {
       height: 400,
       width: 400,
       child: SfRangeSlider(
-        min: DateTime(2010, 01, 01),
-        max: DateTime(2020, 01, 01),
+        min: DateTime(2010),
+        max: DateTime(2020),
         dragMode: SliderDragMode.onThumb,
         showLabels: true,
         showTicks: true,
@@ -59,7 +59,7 @@ N> It is applicable for both horizontal and vertical range slider.
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2012, 01, 01), DateTime(2016, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2012), DateTime(2016));
 
 @override
 Widget build(BuildContext context) {
@@ -68,8 +68,8 @@ Widget build(BuildContext context) {
       height: 400,
       width: 400,
       child: SfRangeSlider(
-        min: DateTime(2010, 01, 01),
-        max: DateTime(2020, 01, 01),
+        min: DateTime(2010),
+        max: DateTime(2020),
         dragMode: SliderDragMode.betweenThumbs,
         showLabels: true,
         showTicks: true,
@@ -102,7 +102,7 @@ N> It is applicable for both horizontal and vertical range slider.
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2014, 01, 01), DateTime(2016, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2014), DateTime(2016));
 
 @override
 Widget build(BuildContext context) {
@@ -111,8 +111,8 @@ Widget build(BuildContext context) {
       height: 400,
       width: 400,
       child: SfRangeSlider(
-        min: DateTime(2010, 01, 01),
-        max: DateTime(2020, 01, 01),
+        min: DateTime(2010),
+        max: DateTime(2020),
         dragMode: SliderDragMode.both,
         showLabels: true,
         showTicks: true,
diff --git a/Flutter/range-slider/getting-started.md b/Flutter/range-slider/getting-started.md
index c391b10c..0c08156a 100644
--- a/Flutter/range-slider/getting-started.md
+++ b/Flutter/range-slider/getting-started.md
@@ -281,9 +281,9 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _min = DateTime(2008, 01, 01);
-DateTime _max = DateTime(2018, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2012, 01, 01), DateTime(2014, 01, 01));
+DateTime _min = DateTime(2008);
+DateTime _max = DateTime(2018);
+SfRangeValues _values = SfRangeValues(DateTime(2012), DateTime(2014));
 
 @override
 Widget build(BuildContext context) {
@@ -319,9 +319,9 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _min = DateTime(2008, 01, 01);
-DateTime _max = DateTime(2018, 01, 01);
-SfRangeValues _values = SfRangeValues(DateTime(2012, 01, 01), DateTime(2014, 01, 01));
+DateTime _min = DateTime(2008);
+DateTime _max = DateTime(2018);
+SfRangeValues _values = SfRangeValues(DateTime(2012), DateTime(2014));
 
 @override
 Widget build(BuildContext context) {
diff --git a/Flutter/range-slider/images/label-and-divider/edge-label-placement.png b/Flutter/range-slider/images/label-and-divider/edge-label-placement.png
new file mode 100644
index 00000000..61704bf6
Binary files /dev/null and b/Flutter/range-slider/images/label-and-divider/edge-label-placement.png differ
diff --git a/Flutter/range-slider/images/label-and-divider/vertical-edge-label-placement.png b/Flutter/range-slider/images/label-and-divider/vertical-edge-label-placement.png
new file mode 100644
index 00000000..3c9e3f70
Binary files /dev/null and b/Flutter/range-slider/images/label-and-divider/vertical-edge-label-placement.png differ
diff --git a/Flutter/range-slider/interval.md b/Flutter/range-slider/interval.md
index d09dc102..38ef47ef 100644
--- a/Flutter/range-slider/interval.md
+++ b/Flutter/range-slider/interval.md
@@ -97,14 +97,14 @@ The type of date interval can range from years to seconds. It is mandatory for d
 
 For date values, the range slider does not have auto interval support. So, it is mandatory to set [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/interval.html), [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateIntervalType.html), and [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateFormat.html) for date values.
 
-For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/min.html) is `DateTime(2000, 01, 01)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/max.html) is `DateTime(2005, 01, 01)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/interval.html) is `1`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateFormat.html) is `DateFormat.y()` then the range slider will render the labels, major ticks, and dividers at 2000, 2001, 2002 and so on.
+For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/min.html) is `DateTime(2000)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/max.html) is `DateTime(2005)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/interval.html) is `1`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/dateFormat.html) is `DateFormat.y()` then the range slider will render the labels, major ticks, and dividers at 2000, 2001, 2002 and so on.
 
 ### Horizontal
 
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -112,7 +112,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child:  SfRangeSlider(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -141,7 +141,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -149,7 +149,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child:  SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -253,14 +253,14 @@ Widget build(BuildContext context) {
 
 You can move the thumb in discrete manner for date values based on the value provided in the [`stepDuration`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/stepDuration.html) property in the range slider.
 
-For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/min.html) is DateTime(2015, 01, 01) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/max.html) is DateTime(2020, 01, 01) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/stepDuration.html) is SliderDuration(years: 1, months: 6),the range slider will move the thumbs at DateTime(2015, 01, 01), DateTime(2016, 07, 01), DateTime(2018, 01, 01),and DateTime(2019, 07, 01).
+For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/min.html) is DateTime(2015) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/max.html) is DateTime(2020) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/stepDuration.html) is SliderDuration(years: 1, months: 6),the range slider will move the thumbs at DateTime(2015), DateTime(2016, 07), DateTime(2018),and DateTime(2019, 07).
 
 ### Horizontal
 
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2006, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2006));
 
 @override
 Widget build(BuildContext context) {
@@ -268,8 +268,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfRangeSlider(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               stepDuration: SliderStepDuration(years: 2),
               dateFormat: DateFormat.y(),
@@ -298,7 +298,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2006, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2006));
 
 @override
 Widget build(BuildContext context) {
@@ -306,8 +306,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfRangeSlider.vertical(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               stepDuration: SliderStepDuration(years: 2),
               dateFormat: DateFormat.y(),
@@ -338,7 +338,7 @@ You can select a particular interval by tapping when setting the [`enableInterva
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2006, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2006));
 
 @override
 Widget build(BuildContext context) {
@@ -346,8 +346,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfRangeSlider(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               enableIntervalSelection: true,
               dateFormat: DateFormat.y(),
@@ -377,7 +377,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2004, 01, 01), DateTime(2006, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2004), DateTime(2006));
 
 @override
 Widget build(BuildContext context) {
@@ -385,8 +385,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfRangeSlider.vertical(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               enableIntervalSelection: true,
               dateFormat: DateFormat.y(),
diff --git a/Flutter/range-slider/labels-and-divider.md b/Flutter/range-slider/labels-and-divider.md
index 3047c38c..622ce459 100644
--- a/Flutter/range-slider/labels-and-divider.md
+++ b/Flutter/range-slider/labels-and-divider.md
@@ -178,7 +178,7 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -186,7 +186,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -215,7 +215,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -223,7 +223,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -254,7 +254,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2000, 03, 01), DateTime(2000, 07, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2000, 03), DateTime(2000, 07));
 
 @override
 Widget build(BuildContext context) {
@@ -262,7 +262,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2000, 09, 01, 24),
                     values: _values,
                     interval: 2,
@@ -291,7 +291,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2000, 03, 01), DateTime(2000, 07, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2000, 03), DateTime(2000, 07));
 
 @override
 Widget build(BuildContext context) {
@@ -299,7 +299,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2000, 09, 01, 24),
                     values: _values,
                     interval: 2,
@@ -410,7 +410,7 @@ The [`labelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -418,7 +418,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -448,7 +448,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-SfRangeValues _values = SfRangeValues(DateTime(2002, 01, 01), DateTime(2003, 01, 01));
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
 
 @override
 Widget build(BuildContext context) {
@@ -456,7 +456,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfRangeSlider.vertical(
-                    min: DateTime(2000, 01, 01, 00),
+                    min: DateTime(2000),
                     max: DateTime(2004, 12, 31, 24),
                     values: _values,
                     interval: 1,
@@ -481,6 +481,86 @@ Widget build(BuildContext context) {
 
 ![Label placement support](images/label-and-divider/vertical-label-placement.png)
 
+## Edge Label placement
+
+The [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/edgeLabelPlacement.html) property is used to place the edge labels either inside the major ticks or on the major ticks. The default value of [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/edgeLabelPlacement.html) property is `EdgeLabelPlacement.auto`.
+
+### Horizontal
+
+{% tabs %}
+{% highlight Dart %}
+
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
+
+@override
+Widget build(BuildContext context) {
+  return MaterialApp(
+      home: Scaffold(
+          body: Center(
+              child: SfRangeSlider(
+                    min: DateTime(2000),
+                    max: DateTime(2004, 12, 31, 24),
+                    values: _values,
+                    interval: 1,
+                    showLabels: true,
+                    showTicks: true,
+                    edgeLabelPlacement: EdgeLabelPlacement.inside,
+                    dateFormat: DateFormat.y(),
+                    dateIntervalType: DateIntervalType.years,
+                    onChanged: (SfRangeValues newValues) {
+                        setState(() {
+                            _values = newValues;
+                        });
+                   },
+              ),
+          )
+      )
+  );
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+![Edge Label placement support](images/label-and-divider/edge-label-placement.png)
+
+### Vertical
+
+{% tabs %}
+{% highlight Dart %}
+
+SfRangeValues _values = SfRangeValues(DateTime(2002), DateTime(2003));
+
+@override
+Widget build(BuildContext context) {
+  return MaterialApp(
+      home: Scaffold(
+          body: Center(
+              child: SfRangeSlider.vertical(
+                    min: DateTime(2000),
+                    max: DateTime(2004, 12, 31, 24),
+                    values: _values,
+                    interval: 1,
+                    showLabels: true,
+                    showTicks: true,
+                    edgeLabelPlacement: EdgeLabelPlacement.inside,
+                    dateFormat: DateFormat.y(),
+                    dateIntervalType: DateIntervalType.years,
+                    onChanged: (SfRangeValues newValues) {
+                        setState(() {
+                            _values = newValues;
+                        });
+                   },
+              ),
+          )
+      )
+  );
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+![Edge Label placement support](images/label-and-divider/vertical-edge-label-placement.png)
+
 ## Customize label text
 
 You can format or change the whole numeric or date label text using the [`labelFormatterCallback`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfRangeSlider/labelFormatterCallback.html). Its arguments are,
diff --git a/Flutter/slider/basic-features.md b/Flutter/slider/basic-features.md
index 094e5266..e523e71b 100644
--- a/Flutter/slider/basic-features.md
+++ b/Flutter/slider/basic-features.md
@@ -107,7 +107,7 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -115,7 +115,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfSlider(
-                min: DateTime(2000, 01, 01, 00),
+                min: DateTime(2000),
                 max: DateTime(2004, 12, 31, 24),
                 value: _value,
                 interval: 1,
@@ -143,7 +143,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -151,7 +151,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
               child: SfSlider.vertical(
-                min: DateTime(2000, 01, 01, 00),
+                min: DateTime(2000),
                 max: DateTime(2004, 12, 31, 24),
                 value: _value,
                 interval: 1,
@@ -412,7 +412,7 @@ Widget build(BuildContext context) {
                 value: _value,
                 interval: 2,
                 activeColor: Colors.red,
-                inactiveColor: Colors.red.withOpacity(0.2),
+                inactiveColor: Colors.red.withAlpha((255.0 * 0.2).round()),
                 showDividers: true,
                 showTicks: true,
                 showLabels: true,
@@ -432,7 +432,7 @@ Widget build(BuildContext context) {
 
 ![Inactive color support](images/basic-features/inactive-color.png)
 
-### Horizontal
+### Vertical
 
 {% tabs %}
 {% highlight Dart %}
@@ -450,7 +450,7 @@ Widget build(BuildContext context) {
                 value: _value,
                 interval: 2,
                 activeColor: Colors.red,
-                inactiveColor: Colors.red.withOpacity(0.2),
+                inactiveColor: Colors.red.withAlpha((255.0 * 0.2).round()),
                 showDividers: true,
                 showTicks: true,
                 showLabels: true,
diff --git a/Flutter/slider/getting-started.md b/Flutter/slider/getting-started.md
index 40b559c0..600cce7f 100644
--- a/Flutter/slider/getting-started.md
+++ b/Flutter/slider/getting-started.md
@@ -273,9 +273,9 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _min = DateTime(2008, 01, 01);
-DateTime _max = DateTime(2018, 01, 01);
-DateTime _value = DateTime(2012, 01, 01);
+DateTime _min = DateTime(2008);
+DateTime _max = DateTime(2018);
+DateTime _value = DateTime(2012);
 
 @override
 Widget build(BuildContext context) {
@@ -309,9 +309,9 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _min = DateTime(2008, 01, 01);
-DateTime _max = DateTime(2018, 01, 01);
-DateTime _value = DateTime(2012, 01, 01);
+DateTime _min = DateTime(2008);
+DateTime _max = DateTime(2018);
+DateTime _value = DateTime(2012);
 
 @override
 Widget build(BuildContext context) {
diff --git a/Flutter/slider/images/label-and-divider/edge-label-placement.png b/Flutter/slider/images/label-and-divider/edge-label-placement.png
new file mode 100644
index 00000000..10de4e7d
Binary files /dev/null and b/Flutter/slider/images/label-and-divider/edge-label-placement.png differ
diff --git a/Flutter/slider/images/label-and-divider/vertical-edge-label-placement.png b/Flutter/slider/images/label-and-divider/vertical-edge-label-placement.png
new file mode 100644
index 00000000..6d9fd344
Binary files /dev/null and b/Flutter/slider/images/label-and-divider/vertical-edge-label-placement.png differ
diff --git a/Flutter/slider/interval.md b/Flutter/slider/interval.md
index c8256bef..92296d30 100644
--- a/Flutter/slider/interval.md
+++ b/Flutter/slider/interval.md
@@ -97,14 +97,14 @@ The type of date interval. It can be years to seconds. It is mandatory for date
 
 For date values, the slider does not have auto interval support. So, it is mandatory to set [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/interval.html), [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateIntervalType.html), and [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateFormat.html) for date values.
 
-For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/min.html) is `DateTime(2000, 01, 01)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/max.html) is `DateTime(2005, 01, 01)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/interval.html) is `1`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateFormat.html) is `DateFormat.y()` then the slider will render the labels, major ticks, and dividers at 2000, 2001, 2002 and so on.
+For example, if [`min`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/min.html) is `DateTime(2000)` and [`max`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/max.html) is `DateTime(2005)` and [`interval`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/interval.html) is `1`, [`dateIntervalType`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateIntervalType.html) is `DateIntervalType.years`, [`dateFormat`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/dateFormat.html) is `DateFormat.y()` then the slider will render the labels, major ticks, and dividers at 2000, 2001, 2002 and so on.
 
 ### Horizontal
 
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -112,7 +112,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child:  SfSlider(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -141,7 +141,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -149,7 +149,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child:  SfSlider.vertical(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -253,14 +253,14 @@ Widget build(BuildContext context) {
 
 You can move the thumb in discrete manner for date values using the [`stepDuration`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/stepDuration.html) property in the slider.
 
-For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/min.html) is DateTime(2015, 01, 01) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/max.html) is DateTime(2020, 01, 01) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/stepDuration.html) is SliderDuration(years: 1, months: 6),the slider will move the thumbs at DateTime(2015, 01, 01), DateTime(2016, 07, 01), DateTime(2018, 01, 01),and DateTime(2019, 07, 01).
+For example, if [min](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/min.html) is DateTime(2015) and [max](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/max.html) is DateTime(2020) and [stepDuration](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/stepDuration.html) is SliderDuration(years: 1, months: 6),the slider will move the thumbs at DateTime(2015), DateTime(2016, 07), DateTime(2018),and DateTime(2019, 07).
 
 ### Horizontal
 
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2004, 01, 01);
+DateTime _value = DateTime(2004);
 
 @override
 Widget build(BuildContext context) {
@@ -268,8 +268,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               stepDuration: SliderStepDuration(years: 2),
               dateFormat: DateFormat.y(),
@@ -298,7 +298,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2004, 01, 01);
+DateTime _value = DateTime(2004);
 
 @override
 Widget build(BuildContext context) {
@@ -306,8 +306,8 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider.vertical(
-              min: DateTime(2000, 01, 01),
-              max: DateTime(2010, 01, 01),
+              min: DateTime(2000),
+              max: DateTime(2010),
               interval: 2,
               stepDuration: SliderStepDuration(years: 2),
               dateFormat: DateFormat.y(),
diff --git a/Flutter/slider/labels-and-divider.md b/Flutter/slider/labels-and-divider.md
index b43e2e54..8b7aaf4a 100644
--- a/Flutter/slider/labels-and-divider.md
+++ b/Flutter/slider/labels-and-divider.md
@@ -178,7 +178,7 @@ N> You must import [`intl`](https://pub.dev/packages/intl) package for formattin
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -186,7 +186,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -215,7 +215,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -223,7 +223,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider.vertical(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -253,7 +253,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2000, 03, 01);
+DateTime _value = DateTime(2000, 03);
 
 @override
 Widget build(BuildContext context) {
@@ -261,7 +261,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2000, 09, 01, 24),
               value: _value,
               interval: 2,
@@ -290,7 +290,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2000, 03, 01);
+DateTime _value = DateTime(2000, 03);
 
 @override
 Widget build(BuildContext context) {
@@ -298,7 +298,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider.vertical(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2000, 09, 01, 24),
               value: _value,
               interval: 2,
@@ -409,7 +409,7 @@ The [`labelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -417,7 +417,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -447,7 +447,7 @@ Widget build(BuildContext context) {
 {% tabs %}
 {% highlight Dart %}
 
-DateTime _value = DateTime(2002, 01, 01);
+DateTime _value = DateTime(2002);
 
 @override
 Widget build(BuildContext context) {
@@ -455,7 +455,7 @@ Widget build(BuildContext context) {
       home: Scaffold(
           body: Center(
             child: SfSlider.vertical(
-              min: DateTime(2000, 01, 01, 00),
+              min: DateTime(2000),
               max: DateTime(2004, 12, 31, 24),
               value: _value,
               interval: 1,
@@ -480,6 +480,86 @@ Widget build(BuildContext context) {
 
 ![Label placement support](images/label-and-divider/vertical-label-placement.png)
 
+## Edge Label placement
+
+The [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/edgeLabelPlacement.html) property is used to place the edge labels either inside the major ticks or on the major ticks. The default value of the [`edgeLabelPlacement`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/edgeLabelPlacement.html) property is `EdgeLabelPlacement.auto`.
+
+### Horizontal
+
+{% tabs %}
+{% highlight Dart %}
+
+DateTime _value = DateTime(2002);
+
+@override
+Widget build(BuildContext context) {
+  return MaterialApp(
+      home: Scaffold(
+          body: Center(
+            child: SfSlider(
+              min: DateTime(2000),
+              max: DateTime(2004, 12, 31, 24),
+              value: _value,
+              interval: 1,
+              showLabels: true,
+              showTicks: true,
+              edgeLabelPlacement: EdgeLabelPlacement.inside,
+              dateFormat: DateFormat.y(),
+              dateIntervalType: DateIntervalType.years,
+              onChanged: (dynamic newValue) {
+                setState(() {
+                  _value = newValue;
+                });
+              },
+            ),
+          )
+      )
+  );
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+![Edge Label placement support](images\label-and-divider\edge-label-placement.png)
+
+### Vertical
+
+{% tabs %}
+{% highlight Dart %}
+
+DateTime _value = DateTime(2002);
+
+@override
+Widget build(BuildContext context) {
+  return MaterialApp(
+      home: Scaffold(
+          body: Center(
+            child: SfSlider.vertical(
+              min: DateTime(2000),
+              max: DateTime(2004, 12, 31, 24),
+              value: _value,
+              interval: 1,
+              showLabels: true,
+              showTicks: true,
+              edgeLabelPlacement: EdgeLabelPlacement.inside,
+              dateFormat: DateFormat.y(),
+              dateIntervalType: DateIntervalType.years,
+              onChanged: (dynamic newValue) {
+                setState(() {
+                  _value = newValue;
+                });
+              },
+            ),
+          )
+      )
+  );
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+![Edge Label placement support](images\label-and-divider\vertical-edge-label-placement.png)
+
 ## Customize label text
 
 You can format or change the whole numeric or date label text using the [`labelFormatterCallback`](https://pub.dev/documentation/syncfusion_flutter_sliders/latest/sliders/SfSlider/labelFormatterCallback.html). Its arguments are,
diff --git a/Flutter/slider/ticks.md b/Flutter/slider/ticks.md
index 225846d8..57e429d4 100644
--- a/Flutter/slider/ticks.md
+++ b/Flutter/slider/ticks.md
@@ -402,7 +402,7 @@ Widget build(BuildContext context) {
 
 ### Vertical
 
-You can change the major and minor ticks size of the slider using the [`tickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/tickSize.html) and [`minorTickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/minorTickSize.html) properties respectively. The default value of the [`tickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/tickSize.html) property is `Size(1.0, 8.0)` and [`minorTickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/minorTickSize.html) property is `Size(5.0, 1.0)`.
+You can change the major and minor ticks size of the slider using the [`tickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/tickSize.html) and [`minorTickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/minorTickSize.html) properties respectively. The default value of the [`tickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/tickSize.html) property is `Size(8.0, 1.0)` and [`minorTickSize`](https://pub.dev/documentation/syncfusion_flutter_core/latest/theme/SfSliderThemeData/minorTickSize.html) property is `Size(5.0, 1.0)`.
 
 {% tabs %}
 {% highlight Dart %}