Skip to content

Instantly share code, notes, and snippets.

@ercantomac
Created December 20, 2023 09:56
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ercantomac/39bdaed996b2d36adad84720f336eb48 to your computer and use it in GitHub Desktop.
Save ercantomac/39bdaed996b2d36adad84720f336eb48 to your computer and use it in GitHub Desktop.
skeuomorphic button by DALL-E
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.grey[300],
body: Center(
child: LoginButton(),
),
),
);
}
}
class LoginButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
// Define the action when the button is tapped
print('Login Button Tapped');
},
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.2),
offset: const Offset(4, 4),
blurRadius: 15,
spreadRadius: 1,
),
const BoxShadow(
color: Colors.white,
offset: Offset(-4, -4),
blurRadius: 15,
spreadRadius: 1,
),
],
),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 15),
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.circular(15),
gradient: LinearGradient(
colors: [Colors.grey[200]!, Colors.grey[300]!],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: Text(
'Login',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.grey[700],
shadows: const [
Shadow(
color: Colors.white,
offset: Offset(1, 1),
),
],
),
),
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment