Home Page Code

import 'package:flutter/material.
dart';
void main() {
runApp(const FigmaToCodeApp());
}
// Generated by: https://www.figma.com/community/plugin/842128343887142055/

class FigmaToCodeApp extends StatelessWidget {
const FigmaToCodeApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: const Color.fromARGB(255, 18, 32, 47),
),
home: Scaffold(
body: ListView(children: [
HomePage(),
]),
),
);
}
}
class HomePage extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Column(
children: [
Container(
width: 360,
height: 800,
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(color: Colors.white),
child: Stack(
children: [
Positioned(
left: 85,
top: 55,
child: Text(
'september 28',
style: TextStyle(
color: Color(0xFF5E5E5E),
fontSize: 12,
fontFamily: 'Inter',
fontWeight: FontWeight.w400,
height: 0,
),
),
),
Positioned(
left: 15,
top: 57,
child: Container(
width: 193,
height: 52,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 50,
height: 50,
decoration: ShapeDecoration(
image: DecorationImage(
image:
NetworkImage("https://via.placeholder.com/50x50"),
fit: BoxFit.fill,
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(69),
),
),
),
),
Positioned(
left: 70,
top: 18,
child: Text(
'Hey , xyz',
style: TextStyle(
color: Colors.black,
fontSize: 28,
height: 0,
),
),
),
],
),
),
),
Positioned(
left: 0,
top: 0,
child: Container(
width: 360,
height: 25,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 360,
height: 25,
decoration: BoxDecoration(color: Colors.white),
),
),
Positioned(
left: 35,
top: 9,
child: Text(
'20:09',
style: TextStyle(
fontSize: 12,
height: 0,
),
),
),
Positioned(
left: 261,
top: 3,
child: Container(
width: 20,
height: 20,
padding: const EdgeInsets.only(
top: 2.50,
left: 0.58,
right: 0.57,
bottom: 2.50,
),
decoration: BoxDecoration(),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
,
],
),
),
),
Positioned(
left: 321,
top: 3,
child: Container(
width: 19,
height: 19,
padding: const EdgeInsets.symmetric(horizontal: 3.96,
vertical: 1.58),
child: Row(
children: [
,
],
),
),
),
Positioned(
left: 288,
top: 3,
child: Container(
width: 19,
height: 19,
padding: const EdgeInsets.all(1.58),
child: Row(
children: [
,
],
),
),
),
],
),
),
),
Positioned(
left: 309,
top: 60,
child: Container(
width: 31,
height: 31,
padding: const EdgeInsets.symmetric(horizontal: 3.32, vertical:
2.58),
child: Row(
children: [
Container(
width: 24.36,
height: 25.83,
child: Stack(children: [
,
]),
),
],
),
),
),
Positioned(
left: 38,
top: 728,
child: Container(
width: 283,
height: 52,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 283,
height: 52,
color: Colors.white,
),
shadows: [
BoxShadow(
color: Color(0x38000000),
blurRadius: 16,
offset: Offset(0, 0),
spreadRadius: -3,
)
],
),
),
),
Positioned(
left: 59,
top: 15,
child: Container(
width: 24,
height: 24,
padding: const EdgeInsets.only(left: 3, bottom: 2),
child: Row(
children: [
,
],
),
),
),
Positioned(
left: 129,
top: 14,
child: Container(
width: 26,
height: 26,
top: 3.25,
left: 2.17,
right: 2.17,
bottom: 1.62,
),
child: Row(
children: [
,
],
),
),
),
Positioned(
left: 197,
top: 10,
child: Container(
width: 30,
height: 30,
,
]),
),
),
],
),
),
),
Positioned(
left: 20,
top: 288,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
side: BorderSide(width: 1, color:
Color(0xFF7F7F7F)),
),
),
),
),
Positioned(
left: 14,
top: 12,
child: Text(
'Heart',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
),
Positioned(
left: 14,
top: 55,
child: Container(
width: 118.87,
height: 61,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Text(
'162',
style: TextStyle(
color: Color(0xFF4B4B4B),
fontSize: 12,
height: 0,
),
),
),
Positioned(
left: 0,
top: 46,
child: Text(
'60',
style: TextStyle(
color: Color(0xFF4B4B4B),
fontSize: 12,
height: 0,
),
),
),
],
),
),
),
Positioned(
left: 15,
top: 139,
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: '88 ',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
TextSpan(
text: 'bpm',
style: TextStyle(
fontSize: 12,
height: 0,
),
),
],
),
),
),
],
),
),
),
Positioned(
left: 102,
top: 9,
child: Container(
width: 28,
height: 28,
color: Color(0xFFFF9494),
shape: OvalBorder(),
),
),
),
Positioned(
left: 108,
top: 15,
child: Container(
width: 16,
height: 16,
top: 2,
left: 1.33,
right: 1.33,
bottom: 1.77,
),
child: Row(
children: [
,
],
),
),
),
],
),
),
),
Positioned(
left: 190,
top: 288,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
side: BorderSide(width: 1, color:
Color(0xFF7F7F7F)),
),
),
),
),
Positioned(
left: 14,
top: 15,
child: Text(
'Sleep',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
),
Positioned(
left: 30,
top: 45,
child: Container(
width: 97,
height: 77,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 6.06,
height: 77,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 6.06,
height: 77,
color: Color(0xFFD9D9D9),
borderRadius:
BorderRadius.circular(48),
),
),
),
),
Positioned(
left: 0,
top: 27,
child: Container(
width: 6.06,
height: 50,
color: Color(0xFF7EFF83),
borderRadius:
),
),
),
),
],
),
),
),
Positioned(
left: 30.31,
top: 0,
child: Container(
width: 6.06,
height: 77,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 6.06,
height: 77,
borderRadius:
),
),
),
),
Positioned(
left: 0,
top: 15,
child: Container(
width: 6.06,
height: 62,
borderRadius:
),
),
),
),
],
),
),
),
Positioned(
left: 60.62,
top: 0,
child: Container(
width: 6.06,
height: 77,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 6.06,
height: 77,
borderRadius:
),
),
),
),
Positioned(
left: 0,
top: 49,
child: Container(
width: 6.06,
height: 28,
borderRadius:
),
),
),
),
],
),
),
),
Positioned(
left: 90.94,
top: 0,
child: Container(
width: 6.06,
height: 77,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 6.06,
height: 77,
borderRadius:
),
),
),
),
Positioned(
left: 0,
top: 31,
child: Container(
width: 6.06,
height: 46,
borderRadius:
),
),
),
),
],
),
),
),
],
),
),
),
Positioned(
left: 14,
top: 142,
child: Text(
'08:12 Hrs',
style: TextStyle(
fontSize: 15,
height: 0,
),
),
),
],
),
),
),
Positioned(
left: 107,
top: 9,
child: Container(
width: 28,
height: 28,
color: Color(0xFF9DFF94),
),
),
),
Positioned(
left: 113,
top: 14,
child: Container(
width: 16,
height: 16,
top: 3.33,
left: 0.67,
right: 0.67,
bottom: 2.67,
),
child: Row(
children: [
,
],
),
),
),
],
),
),
),
Positioned(
left: 20,
top: 509,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
side: BorderSide(width: 1, color: Color(0xFF7F7F7F)),
),
),
),
),
Positioned(
left: 9,
top: 18,
child: SizedBox(
width: 41,
height: 16,
child: Text(
'Water',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
),
),
Positioned(
left: 102,
top: 15,
child: Container(
width: 28,
height: 28,
color: Color(0xFFB4D6FF),
),
),
),
Positioned(
left: 106,
top: 18,
child: Container(
width: 20,
height: 20,
padding: const EdgeInsets.symmetric(horizontal: 4.40,
vertical: 0.40),
child: Row(
children: [
,
],
),
),
),
Positioned(
left: 9,
top: 84,
child: Container(
width: 120,
height: 7,
color: Color(0xFFDEDEDE),
),
),
),
),
Positioned(
left: 9,
top: 84,
child: Container(
width: 67,
height: 7,
color: Color(0xFF0019FF),
),
),
),
),
Positioned(
left: 46,
top: 136,
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: '100',
style: TextStyle(
fontSize: 16,
height: 0,
),
),
TextSpan(
text: ' ',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
TextSpan(
text: 'ml',
style: TextStyle(
color: Color(0xFFABABAB),
fontSize: 12,
height: 0,
),
),
],
),
),
),
],
),
),
),
Positioned(
left: 190,
top: 509,
child: Container(
width: 150,
height: 170,
child: Stack(
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 150,
height: 170,
side: BorderSide(width: 1, color: Color(0xFF7F7F7F)),
),
),
),
),
Positioned(
left: 12,
top: 18,
child: SizedBox(
width: 41,
height: 16,
child: Text(
'Walk',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
),
),
Positioned(
left: 110,
top: 14,
child: Container(
width: 28,
height: 28,
color: Color(0xFFD0E0FF),
),
),
),
Positioned(
left: 116,
top: 20,
child: Container(
width: 16,
height: 16,
child: Row(
children: [
Container(
width: 16,
height: 16,
,
]),
),
],
),
),
),
Positioned(
left: 41,
top: 134,
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: '4280 ',
style: TextStyle(
fontSize: 14,
height: 0,
),
),
TextSpan(
text: 'steps',
style: TextStyle(
color: Color(0xFFB4B4B4),
fontSize: 12,
height: 0,
),
),
],
),
),
),
],
),
),
),
Positioned(
left: 42,
top: 148,
child: Container(
width: 276,
height: 100,
color: Color(0xFF4E55FF),
),
),
child: Stack(
children: [
Positioned(
left: 9,
top: 25,
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: 'welcome to \n',
style: TextStyle(
fontSize: 18,
height: 0,
),
),
TextSpan(
text: 'Health assure',
style: TextStyle(
fontSize: 18,
fontFamily: 'Krona One',
height: 0,
letterSpacing: -0.99,
),
),
],
),
),
),
Positioned(
left: 167,
top: 9,
child: Container(
width: 98,
height: 98,
decoration: BoxDecoration(
image: DecorationImage(
image:
NetworkImage("https://via.placeholder.com/98x98"),
fit: BoxFit.fill,
),
),
),
),
],
),
),
),
],
),
),
],
);
}
}

Home Page Code

Uploaded by

Copyright:

Available Formats

You might also like

Home Page Code

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Home Page Code

Uploaded by

Copyright:

Available Formats

import 'package:flutter/material.

// Generated by: https://www.figma.com/community/plugin/842128343887142055/

class HomePage extends StatelessWidget {

You might also like